A curated roundup of frontend links covering a new CSS scroll-axis-lock property for diagonal scrolling in Chromium, using Baseline data to audit and trim JavaScript dependencies, dark mode toggle UX design, memory-leak soak testing for SPAs with Playwright, an improved CSS text-stroke technique, an updated WCAG-EM accessibility reporting tool, a critical CSS generator, and a personal account of fighting bot traffic with Cloudflare rules.

3m read timeFrom frontendfoc.us
Post cover image

Questions this post answers

How do I stop the browser from locking my scroll gesture to one axis in a map or zoom interface?

Use the CSS property scroll-axis-lock set to none, which disables the browser's default axis 'railing' behavior that locks a scroll gesture to whichever axis it started closest to. This is useful for maps and zoom UIs where diagonal scrolling should be immediate rather than snapped to one direction. It is currently supported in Chromium 153 and above, and degrades gracefully in browsers that don't support it. daily.dev surfaces browser feature updates like this for developers building custom scroll and zoom interactions.

How can I detect memory leaks in a single-page application before they reach production?

Run a 'soak test' with Playwright that repeatedly loops through a user flow while monitoring Chrome's DOM node count and event listener count, failing CI if either keeps climbing across iterations instead of stabilizing. This approach catches gradual memory leaks in SPAs that unit tests typically miss, since the leak only becomes visible after many repeated interactions. developers hardening CI pipelines against SPA memory leaks can track testing techniques like this on daily.dev.

5.9K Impressions