Speeding Up Your Sass Compilation in Vite and Webpack
A quick guide to adopting the modern Sass API
Sass compilation can be a speed bottleneck in your build, but it doesn’t have to be anymore.
If you’d like to learn how to create parallax scrolling for your website, Paul Lewis’ guide to performant parallaxing is the perfect place to start.
Thanks to Rachel Nabors for pointing us to Paul Lewis’ excellent article on Performant Parallaxing. This article is so useful, we couldn’t pass up the opportunity to recommend it. Continue reading for a quick summary or head over to Paul’s article right away!
Paul, a developer at Google, starts with the don’ts. Don’t use scroll events to create a parallax effect.
JavaScript doesn’t guarantee that parallaxing will keep in step with the page’s scroll position.
Trying to achieve a parallax look by changing background position doesn’t work well either, negatively effecting the animation.
Paul recommends using CSS 3D for performant parallaxing, and gives detailed instructions for how to do just that. Anticipating the bugs for us, Paul includes various workarounds.
Have you used this approach? Did it work? Let us know by sending us a message via Twitter.
A quick guide to adopting the modern Sass API
Sass compilation can be a speed bottleneck in your build, but it doesn’t have to be anymore.
CSS Working Group updates from July
Over the last month, the CSS Working Group has determined we can loosen containment restrictions for query containers, and agreed on a syntax for special-case support queries (like support for the gap property in a flex context, or support for align-content in a block flow context).
What I’ve been working on as an Invited Expert
The CSS Working Group has regular face-to-face meetings (hybrid online/in-person) throughout the year, and they always result in a flurry of activity! Here’s a rundown of some highlights from the last few months, with a focus on the features I maintain.