Bookmarks

Great guides from Paul Lewis on CSS performance problems and how to debug them in Chrome dev tools

Whole bunch of useful dev tools tips for designing in the browser:

A script for creating a performant menu animation with transform scale. Interesting technique of calculating a custom animation based on menu size in JS, then injecting it into the DOM.

Useful tip on forcing CSS animations to be paused until assets (like large images) are loaded

Useful gist showing quick testing set up for React & axe-core for accessibility

Quick tip to enable media query detection/visualisation in Chrome Dev Tools

Scanner from mozilla to check for security headers/settings on your web sites

Some great slides on the why and how of react-virtualized for rendering long/complex lists

Some useful techniques for animating elements without a hard-coded height. No perfect solutions unfortunately, but still useful in some situations

Neat trick using vmin measurement unit to make a more balanced header on large and small devices

Interesting notes on scroll performance across the browsers - I didn't realise they optimised to make scrolling multi-threaded

Useful reference showing which CSS properties will trigger repaints/layouts/etc if changed

Btw, taken from this excellent explainer series from @linclark

A list of code smells in CSS from Harry Roberts. Mostly agree with the ones listed, however I find some of the sentiments too strong (too much "never do this")

Massive list of resources for web design. Everything from accessibility to UX patterns

Short & simple practical introduction to CSS Grid

Great article on a "stretchy" navigation with submenus that expands/contracts based on viewport height (see demos for a better explanation). I can see this being useful for file tree UIs too

Nice article walking through usages of viewport height (vh) and viewport width (vw) units in CSS. Some useful explanatory examples

Always a sucker for Swiss Alps maps 😍 Climbed a handful for these :)

Another piece by @b0rk on job descriptions and how to write good ones. See another one of my links for the job description she ended up writing