examples: add 6 new over-engineering survivors + platform-native guide (#109)
New examples (examples/): - modal-dialog: <dialog> vs Radix/react-modal - url-params: URLSearchParams vs query-string - number-formatting: Intl.NumberFormat vs numeral - infinite-scroll: IntersectionObserver vs react-infinite-scroll-component - deep-clone: structuredClone vs lodash.cloneDeep / JSON hack - group-by: Object.groupBy vs lodash.groupBy New doc (docs/platform-native.md): Comprehensive reference of platform-native solutions across HTML elements, CSS, Browser APIs, Node.js stdlib, Python stdlib, and database features. Covers 60+ cases where the platform already has what developers reach for a package to do.
This commit is contained in:
@@ -0,0 +1,31 @@
|
||||
# Deep Clone
|
||||
|
||||
**Task:** "Deep clone this object."
|
||||
|
||||
## Without Ponytail
|
||||
|
||||
```bash
|
||||
npm install lodash
|
||||
```
|
||||
|
||||
```js
|
||||
import { cloneDeep } from "lodash";
|
||||
|
||||
const copy = cloneDeep(original);
|
||||
```
|
||||
|
||||
Or the classic hack:
|
||||
|
||||
```js
|
||||
// fragile: loses Date, undefined, Map, Set, circular refs, functions
|
||||
const copy = JSON.parse(JSON.stringify(original));
|
||||
```
|
||||
|
||||
## With Ponytail
|
||||
|
||||
```js
|
||||
// ponytail: structuredClone does this
|
||||
const copy = structuredClone(original);
|
||||
```
|
||||
|
||||
**1 dependency (or a fragile hack) → 1 built-in.** `structuredClone` handles `Date`, `Map`, `Set`, `ArrayBuffer`, `RegExp`, circular references, and more — everything `JSON.parse/stringify` silently drops. Available in every browser since 2022 and Node.js since v17. Pull lodash in when you need the rest of it, not for one function.
|
||||
Reference in New Issue
Block a user