-
addEventListener + removeEventListener
tl;dr: Avoid memory leaks by ensuring that if you register a callback to
addEventListeneryou also unregister it withremoveEventListenerlater 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
Dateto measure durations. Use theperformanceinterface to measure durations because of its high precision. -
Intl
tl;dr: Use
Intlto 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
svgoto minify SVGs. -
Brotli
tl;dr: Compress assets such as JavaScript and CSS using Brotli rather than gzip.