Javascript

I loathe type assertions in TypeScript. Every as is a spot where I am telling the compiler “trust me”, and every as unknown as is me telling it to stop thinking altogether. So when I found one in an adapter function I was working on, I wanted to get rid of it. In the process, I learned an interesting fact about how unknown and Object.assign behave together. The Adapter The setup was roughly this: a library exposes a function that takes a client, and that client must have a request function resolving to a Response with a typed json method. On my side, I already had a function that does the request and returns the parsed data directly. I just needed to adapt one to the other. ...

TL;DR: Storing full collection data in window.history.state is expensive (serialization time, retained memory, and browser size limits). Prefer storing cursors/params and keep large data in an in-memory cache keyed by URL; use sessionStorage/IndexedDB if persistence is required. I’ve found an interesting issue with the Shopify Hydrogen component because it saves all nodes on a page in window.history.state as you can see in this line. For the particular website I am working with at the moment, the collection page has quite a bunch of data. When I tested, showing about 100 products on the page meant having ~8MB for the serialized version of the object using JSON.stringify. Deserialized structures also incur engine overhead (object headers, indices). The Pagination component from Shopify that we use does many things, but what I want to emphasize is that it saves the collection data in window.history.state: ...