✨ Site Nav from tag graph

[ikesau]

Removes the hardcoded SiteNavigationStatic object that powered the site nav and replaces it with a JSON file representation of the tag graph from the database.

As a reminder, the tag graph shape is:

interface TagGraphNode {
    children: TagGraphNode[]
    id: number
    isTopic: boolean
    name: string
    path: number[]
    slug: string | null
    weight: number
}

[owidbot]

Quick links (staging server):

Site Dev	Site Preview	Admin	Wizard	Docs

Login: ssh owid@staging-site-sitenav-from-tag-graph

• Site-screenshots: https://github.com/owid/site-screenshots/compare/sitenav-from-tag-graph
• SVG tester: https://github.com/owid/owid-grapher-svgs/compare/sitenav-from-tag-graph

SVG tester:

Number of differences (default views): 0 ✅
Number of differences (all views): 0 ✅

Edited: 2025-01-13 22:01:06 UTC
Execution time: 1.25 seconds

[ikesau]

Technically we don't need to fetch the topicTagGraph.json when we're on the homepage, because it's already embedded in the homepage gdoc's homepageMetadata, but seeing as the JSON request is ~4kB transferred, I think it's okay to not optimize.

Later, we should see if it's possible to get this file and dods.json to cache.

[mlbrgl]

nice to see the merging of tag and topics taking shape more visibly!

It seems like the order of tags in the graph is a bit arbitrary at the moment on live, are we waiting for authors to reorder before merging?

[socket-security]

New, updated, and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package	New capabilities	Transitives	Size	Publisher
npm/@colors/colors@1.5.0	environment	0	39.5 kB	dabh
npm/@opentelemetry/api@1.9.0	None	0	1.22 MB	pichlermarc
npm/abort-controller@3.0.0	None	0	76.3 kB	mysticatea
npm/agentkeepalive@4.5.0	network	0	43.7 kB	fengmk2
npm/arrify@2.0.1	None	0	3.19 kB	sindresorhus
npm/at-least-node@1.0.0	None	0	2.63 kB	ryanzim
npm/base64-js@1.5.1	None	0	9.62 kB	feross
npm/bluebird@3.7.2	environment, eval, unsafe	0	632 kB	esailija
npm/buffer-equal-constant-time@1.0.1	None	0	5.23 kB	goinstant
npm/bytes@3.1.2	None	0	12.3 kB	dougwilson
npm/chardet@0.7.0	filesystem	0	74.8 kB	runk
npm/cli-cursor@3.1.0	None	0	4.37 kB	sindresorhus
npm/cli-width@3.0.0	environment	0	11.5 kB	knownasilya
npm/delayed-stream@1.0.0	None	0	8.02 kB	apechimp
npm/denque@2.1.0	None	0	30.4 kB	salakar
npm/depd@2.0.0	environment, eval	0	27.1 kB	dougwilson
npm/destroy@1.2.0	filesystem	0	9.02 kB	dougwilson
npm/detect-libc@2.0.3	filesystem, shell	0	23.6 kB	lovell
npm/ecdsa-sig-formatter@1.0.11	None	0	20.6 kB	d2l-travis-deploy
npm/ee-first@1.1.1	None	0	6.26 kB	dougwilson
npm/encodeurl@2.0.0	None	0	6.98 kB	blakeembrey
npm/end-of-stream@1.4.4	None	0	6.23 kB	mafintosh
npm/enhanced-resolve@5.17.1	unsafe	0	212 kB	evilebottnawi
npm/escape-html@1.0.3	None	0	3.66 kB	dougwilson
npm/etag@1.8.1	filesystem	0	10.8 kB	dougwilson
npm/event-target-shim@5.0.1	None	0	189 kB	mysticatea
npm/extend@3.0.2	None	0	23.5 kB	ljharb
npm/figures@3.2.0	None	0	12.1 kB	sindresorhus
npm/forwarded-parse@2.1.2	None	0	10.4 kB	lpinca
npm/forwarded@0.2.0	None	0	5.88 kB	dougwilson
npm/get-port@5.1.1	network	0	8.74 kB	sindresorhus
npm/graphemer@1.4.0	None	0	812 kB	mattpauldavies
npm/http-errors@2.0.0	None	0	18.8 kB	dougwilson
npm/humanize-ms@1.2.1	None	0	3.66 kB	dead_horse
npm/ieee754@1.2.1	None	0	6.8 kB	feross
npm/ipaddr.js@1.9.1	None	0	42.1 kB	whitequark
npm/is-interactive@1.0.0	None	0	4.62 kB	sindresorhus
npm/is-unicode-supported@0.1.0	None	0	3.54 kB	sindresorhus
npm/json-bigint@1.0.0	None	0	37.3 kB	sidorares
npm/jsonfile@6.1.0	filesystem	0	19.8 kB	ryanzim
npm/jwa@2.0.0	None	0	13.7 kB	omsmith
npm/jws@4.0.0	None	0	17.7 kB	omsmith
npm/lodash.once@4.1.1	None	0	10.2 kB	jdalton
npm/log-symbols@4.1.0	None	0	4.58 kB	sindresorhus
npm/long@5.2.3	None	0	119 kB	dcode
npm/magic-string@0.30.8	None	0	449 kB	antfu
npm/methods@1.1.2	network	0	5.29 kB	dougwilson
npm/mime-db@1.52.0	None	0	206 kB	dougwilson
npm/minimist@1.2.8	None	0	54.5 kB	ljharb
npm/module-details-from-path@1.0.3	None	0	4.47 kB	watson
npm/moment@2.30.1	None	0	4.35 MB	ichernev
npm/mute-stream@0.0.8	None	0	6.51 kB	isaacs
npm/node-forge@1.3.1	None	0	1.66 MB	davidlehn
npm/on-finished@2.4.1	unsafe	0	13.7 kB	dougwilson
npm/os-tmpdir@1.0.2	None	0	3.06 kB	sindresorhus
npm/parseurl@1.3.3	None	0	10.3 kB	dougwilson
npm/pg-int8@1.0.1	None	0	3.19 kB	charmander
npm/pg-protocol@1.7.0	None	0	186 kB	brianc
npm/pg-types@2.2.0	None	0	35.3 kB	bendrucker
npm/pluralize@8.0.0	None	0	17.7 kB	blakeembrey
npm/postgres-array@2.0.0	None	0	4.9 kB	bendrucker
npm/postgres-bytea@1.0.0	None	0	3.06 kB	bendrucker
npm/postgres-date@1.0.7	None	0	5.92 kB	bendrucker
npm/postgres-interval@1.2.0	None	0	6.73 kB	bendrucker
npm/process-nextick-args@2.0.1	None	0	3.17 kB	cwmma
npm/proxy-addr@2.0.7	None	0	15.4 kB	dougwilson
npm/proxy-from-env@1.1.0	environment	0	29.5 kB	rob-w
npm/qs@6.13.0	None	0	254 kB	ljharb
npm/range-parser@1.2.1	None	0	8.46 kB	dougwilson
npm/reflect-metadata@0.2.2	None	0	241 kB	rbuckton
npm/require-in-the-middle@7.4.0	unsafe	0	18.7 kB	trentm
npm/setprototypeof@1.2.0	None	0	4.03 kB	wesleytodd
npm/statuses@2.0.1	None	0	12.1 kB	dougwilson
npm/string_decoder@1.3.0	None	+1	46.5 kB	matteo.collina
npm/tapable@2.2.1	None	0	46.9 kB	sokra
npm/through@2.3.8	None	0	12.5 kB	dominictarr
npm/toidentifier@1.0.1	None	0	4.68 kB	dougwilson
npm/typedarray@0.0.6	None	0	26 kB	substack
npm/util-deprecate@1.0.2	None	0	5.48 kB	tootallnate
npm/utils-merge@1.0.1	None	0	3.72 kB	jaredhanson
npm/vary@1.1.2	None	0	8.75 kB	dougwilson
npm/wcwidth@1.0.1	None	0	14.2 kB	timoxley
npm/xtend@4.0.2	None	0	6.46 kB	raynos

🚮 Removed packages: npm/@nodelib/fs.stat@2.0.5, npm/@nodelib/fs.walk@1.2.8, npm/@rollup/rollup-android-arm-eabi@4.22.4, npm/@rollup/rollup-android-arm64@4.22.4, npm/@rollup/rollup-darwin-arm64@4.22.4, npm/@rollup/rollup-darwin-x64@4.22.4, npm/@rollup/rollup-linux-arm-gnueabihf@4.22.4, npm/@rollup/rollup-linux-arm-musleabihf@4.22.4, npm/@rollup/rollup-linux-arm64-gnu@4.22.4, npm/@rollup/rollup-linux-arm64-musl@4.22.4, npm/@rollup/rollup-linux-powerpc64le-gnu@4.22.4, npm/@rollup/rollup-linux-riscv64-gnu@4.22.4, npm/@rollup/rollup-linux-s390x-gnu@4.22.4, npm/@rollup/rollup-linux-x64-gnu@4.22.4, npm/@rollup/rollup-linux-x64-musl@4.22.4, npm/@rollup/rollup-win32-arm64-msvc@4.22.4, npm/@rollup/rollup-win32-ia32-msvc@4.22.4, npm/@rollup/rollup-win32-x64-msvc@4.22.4, npm/@sentry-internal/browser-utils@8.48.0, npm/@sentry-internal/feedback@8.48.0, npm/@sentry-internal/replay-canvas@8.48.0, npm/@sentry-internal/replay@8.48.0, npm/@types/tough-cookie@2.3.5, npm/abab@2.0.6, npm/acorn-globals@7.0.1, npm/acorn-walk@8.3.1, npm/any-promise@1.3.0, npm/array-buffer-byte-length@1.0.2, npm/array-union@2.1.0, npm/array.prototype.filter@1.0.1, npm/arraybuffer.prototype.slice@1.0.4, npm/available-typed-arrays@1.0.7, npm/boolbase@1.0.0, npm/call-bound@1.0.3, npm/css-select@5.1.0, npm/css-what@6.1.0, npm/cssom@0.5.0, npm/cssstyle@2.3.0, npm/data-urls@3.0.2, npm/data-view-buffer@1.0.2, npm/data-view-byte-length@1.0.2, npm/data-view-byte-offset@1.0.1, npm/decimal.js@10.4.3, npm/dir-glob@3.0.1, npm/domelementtype@2.3.0, npm/domexception@4.0.0, npm/domutils@3.1.0, npm/dunder-proto@1.0.1, npm/es-array-method-boxes-properly@1.0.0, npm/es-set-tostringtag@2.0.3, npm/es-to-primitive@1.3.0, npm/escodegen@2.1.0, npm/fast-glob@3.3.2, npm/for-each@0.3.3, npm/form-data@4.0.0, npm/functions-have-names@1.2.3, npm/get-intrinsic@1.2.6, npm/get-symbol-description@1.1.0, npm/globalthis@1.0.4, npm/gopd@1.2.0, npm/has-bigints@1.0.2, npm/has-proto@1.2.0, npm/has-tostringtag@1.0.2, npm/html-encoding-sniffer@3.0.0, npm/htmlparser2@8.0.2, npm/internal-slot@1.1.0, npm/is-data-view@1.0.2, npm/is-date-object@1.1.0, npm/is-potential-custom-element-name@1.0.1, npm/is-shared-array-buffer@1.0.4, npm/is-symbol@1.1.1, npm/is-typed-array@1.1.15, npm/is-weakref@1.1.0, npm/lilconfig@2.0.6, npm/load-tsconfig@0.2.5, npm/lodash.flattendeep@4.4.0, npm/moo@0.5.1, npm/mz@2.7.0, npm/nearley@2.20.1, npm/nwsapi@2.2.7, npm/parse5-htmlparser2-tree-adapter@7.0.0, npm/performance-now@2.1.0, npm/possible-typed-array-names@1.0.0, npm/psl@1.9.0, npm/railroad-diagrams@1.0.0, npm/randexp@0.4.6, npm/regexp.prototype.flags@1.5.3, npm/safe-array-concat@1.1.3, npm/safe-regex-test@1.1.0, npm/saxes@6.0.0, npm/set-function-name@2.0.2, npm/side-channel@1.1.0, npm/string.prototype.trimend@1.0.9, npm/string.prototype.trimstart@1.0.8, npm/symbol-tree@3.2.4, npm/thenify-all@1.6.0, npm/tough-cookie@4.1.4, npm/ts-interface-checker@0.1.13, npm/typed-array-buffer@1.0.3, npm/typed-array-byte-length@1.0.3, npm/typed-array-byte-offset@1.0.4, npm/typed-array-length@1.0.7, npm/unbox-primitive@1.1.0, npm/universalify@0.2.0, npm/w3c-xmlserializer@4.0.0, npm/webidl-conversions@7.0.0, npm/whatwg-encoding@2.0.0, npm/whatwg-mimetype@3.0.0, npm/ws@8.18.0, npm/xml-name-validator@4.0.0, npm/xmlchars@2.2.0

View full report↗︎