mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
7ffacec8ef
This adds more fixtures modeled after Flight payloads from real sites: - Vercel Dashboard-like (very app-y) - React Docs-like after App Router conversion (mostly MDX site) - Vercel Blog-like (passing down data from CMS) (Actual data is randomly generated with a seed) These are simplifications but I tried to incorporate the originals' corresponding quirks. Such as Vercel Dashboard having many client components; syntax highlight with many small spans in React Docs; Vercel Blog currently shipping a load of data unnecessarily on the index page. (The last one is not ideal but I think we should actually benchmark "bad" cases like this too so I kept that.) ### Screenshots <img width="1325" height="1021" alt="Screenshot 2026-07-15 at 04 29 43" src="https://github.com/user-attachments/assets/62c80722-6fd5-4884-89db-106345f6412d" /> <img width="1360" height="994" alt="Screenshot 2026-07-15 at 04 30 21" src="https://github.com/user-attachments/assets/0db93cd8-43ca-41df-b3e2-c422e0c94656" /> <img width="1368" height="991" alt="Screenshot 2026-07-15 at 04 30 43" src="https://github.com/user-attachments/assets/9369e9be-12a4-4a1e-af32-01b6fdd4a457" /> ### Comparison with real payloads ``` === dashboard.html (fixture) vs p-overview.html (real) total KB 208 637 rows (model/I/T/other) 186/48/7/1 240/125/5/27 byte share model/I/T % 92/4/4 36/62/2 median row size B 590 106 max depth 28 53 mean depth 8.4 10.5 elements per KB(model) 14.9 5.2 pure-data byte share % 24 21 client-ref elements % 41 32 objects:elements ratio 1.17 1.23 avg props per element 1.7 3.1 median children fanout 4 4 string bytes % 24 54 median string len B 10 15 row refs per KB 0.9 0.4 encoded scalars per KB 3.5 1.2 undefined markers 347 740 === docs.html (fixture) vs nextjs-docs.html (real) total KB 261 487 rows (model/I/T/other) 58/15/7/1 55/43/2/20 byte share model/I/T % 93/1/6 94/6/0 median row size B 193 340 max depth 27 32 mean depth 21.9 12.3 elements per KB(model) 0.8 0.8 pure-data byte share % 8 9 client-ref elements % 16 33 objects:elements ratio 6.26 4.92 avg props per element 1.7 2.8 median children fanout 4 4 string bytes % 47 64 median string len B 17 35 row refs per KB 0.2 0.1 encoded scalars per KB 7.5 2.9 undefined markers 1949 1377 === blog.html (fixture) vs vercel-blog.html (real) total KB 475 797 rows (model/I/T/other) 41/15/0/1 102/53/7/14 byte share model/I/T % 100/0/0 87/8/5 median row size B 426 505 max depth 34 44 mean depth 9.7 12.2 elements per KB(model) 0.8 1.1 pure-data byte share % 92 85 client-ref elements % 23 33 objects:elements ratio 28.92 16.39 avg props per element 1.9 2.7 median children fanout 3 4 string bytes % 46 48 median string len B 6 9 row refs per KB 0.1 0.1 encoded scalars per KB 0.4 0.6 undefined markers 161 426 ``` --------- Co-authored-by: Claude Fable 5 <[email protected]>
80 lines
2.3 KiB
JavaScript
80 lines
2.3 KiB
JavaScript
'use client'
|
|
// Real heavy dependencies from the repository standing in for the shared
|
|
// vendor layer a production app ships to the client. Per-method lodash
|
|
// imports keep the module graph fine-grained, like real utility usage.
|
|
import lodash_chunk from 'lodash/chunk'
|
|
import lodash_compact from 'lodash/compact'
|
|
import lodash_concat from 'lodash/concat'
|
|
import lodash_difference from 'lodash/difference'
|
|
import lodash_drop from 'lodash/drop'
|
|
import lodash_fill from 'lodash/fill'
|
|
import lodash_findIndex from 'lodash/findIndex'
|
|
import lodash_flatten from 'lodash/flatten'
|
|
import lodash_flattenDeep from 'lodash/flattenDeep'
|
|
import lodash_fromPairs from 'lodash/fromPairs'
|
|
import lodash_head from 'lodash/head'
|
|
import lodash_indexOf from 'lodash/indexOf'
|
|
import lodash_intersection from 'lodash/intersection'
|
|
import lodash_join from 'lodash/join'
|
|
import lodash_last from 'lodash/last'
|
|
import lodash_nth from 'lodash/nth'
|
|
import lodash_pull from 'lodash/pull'
|
|
import lodash_reverse from 'lodash/reverse'
|
|
import lodash_slice from 'lodash/slice'
|
|
import lodash_sortedIndex from 'lodash/sortedIndex'
|
|
import lodash_tail from 'lodash/tail'
|
|
import lodash_take from 'lodash/take'
|
|
import lodash_union from 'lodash/union'
|
|
import lodash_uniq from 'lodash/uniq'
|
|
import lodash_unzip from 'lodash/unzip'
|
|
import lodash_without from 'lodash/without'
|
|
import lodash_xor from 'lodash/xor'
|
|
import lodash_zip from 'lodash/zip'
|
|
import lodash_countBy from 'lodash/countBy'
|
|
import lodash_every from 'lodash/every'
|
|
import lodash_filter from 'lodash/filter'
|
|
import lodash_find from 'lodash/find'
|
|
import lodash_flatMap from 'lodash/flatMap'
|
|
import lodash_forEach from 'lodash/forEach'
|
|
|
|
const LODASH = [
|
|
lodash_chunk,
|
|
lodash_compact,
|
|
lodash_concat,
|
|
lodash_difference,
|
|
lodash_drop,
|
|
lodash_fill,
|
|
lodash_findIndex,
|
|
lodash_flatten,
|
|
lodash_flattenDeep,
|
|
lodash_fromPairs,
|
|
lodash_head,
|
|
lodash_indexOf,
|
|
lodash_intersection,
|
|
lodash_join,
|
|
lodash_last,
|
|
lodash_nth,
|
|
lodash_pull,
|
|
lodash_reverse,
|
|
lodash_slice,
|
|
lodash_sortedIndex,
|
|
lodash_tail,
|
|
lodash_take,
|
|
lodash_union,
|
|
lodash_uniq,
|
|
lodash_unzip,
|
|
lodash_without,
|
|
lodash_xor,
|
|
lodash_zip,
|
|
lodash_countBy,
|
|
lodash_every,
|
|
lodash_filter,
|
|
lodash_find,
|
|
lodash_flatMap,
|
|
lodash_forEach,
|
|
]
|
|
|
|
export function describeUtils() {
|
|
return LODASH.length
|
|
}
|