-
addEventListener + removeEventListener
tl;dr: Avoid memory leaks by ensuring that if you register a callback to
addEventListener
you also unregister it withremoveEventListener
later on. -
structuredClone
tl;dr: To deep clone objects, Use
structuredClone(value)
rather than theJSON.parse(JSON.stringify(value))
trick. Also, avoid Lodash’s_.cloneDeep(value)
due to import cost. -
requestAnimationFrame + setTimeout
tl;dr: This is how you correctly measure performance after style, layout, and paint operations.
-
V8 Flags
tl;dr: A printout of all Chromium V8 flags. Some are useful for debugging.
-
HTTP/2
tl;dr: Avoid HTTP/1.1 because browsers limit the number of concurrent requests going to HTTP/1.1 origins. Use HTTP/2.
-
performance
tl;dr: Avoid using
Date
to measure durations. Use theperformance
interface to measure durations because of its high precision. -
Intl
tl;dr: Use
Intl
to compute relative dates, rather than rely on Luxon or Moment which are huge size-wise. -
Lazy Loading
tl;dr: Use
loading="lazy"
to defer loading images that are off-screen until the user scrolls near them. -
SVG Minification
tl;dr: Use
svgo
to minify SVGs. -
Brotli
tl;dr: Compress assets such as JavaScript and CSS using Brotli rather than gzip.