# Go forth and scrollĪs of Chrome 49, scrolling is getting smoother. With something as fundamental as scrolling, it’s really important to avoid breaking user expectation, so while these features are in flux it’s still worth adopting a Progressive Enhancement approach, and removing any libraries that attempt to polyfill these behaviors. If you set - say - the element to scroll-behavior: smooth, all scrolls that are triggered either by fragment changes or by window.scrollTo will be animated smoothly! That’s way better than having to use and maintain code from a library that tries to do the same thing. If you want to try it out you’ll be pleased to know it’s shipped in Firefox already, and you can enable it in Chrome Canary using the “Enable experimental Web Platform features” flag. When it comes to fragment-based scrolling, the scroll-behavior CSS property is something else that could help. If you’re interested in Compositor Worklets, or any of the other exciting new features that Houdini brings, look over the Intro to Houdini post by Surma, the Houdini specs, and contribute your thoughts to the Houdini mailing list! # scroll-behavior Given the way that scrolling is handled today, where scroll events are only periodically sent to the main thread (and can be blocked by other main thread work), this would represent a huge leap forward. That said, as the patches land, they will allow you to write JavaScript that’s run as part of the compositor’s pipeline, which in general means that scroll-coupled effects like parallaxing will be kept perfectly in sync with the current scroll position. # HoudiniĬompositor Worklets are part of Houdini, and are yet to be fully spec’d out and implemented. There are two platform standards that are being worked on that could help: Compositor Worklets and the scroll-behavior CSS property. As I mentioned earlier, the approaches that are used today can often be detrimental to both developers and users. Many of us want scroll-coupled effects, like parallaxing, smooth scrolling to a document fragment (like / #somesection). There are other scroll-related goodies in the works that are also worth mentioning. The old, stepped scrolling behavior is going away, and scrolling will be smooth by default! No changes to your code are necessary, except maybe removing any smooth scrolling libraries if you’ve used them. In Chrome 49, the default scroll behavior will be changing Windows, Linux, and ChromeOS. Scrolling is a core interaction of the web, and altering it with libraries should be done with great care. They all too often trigger jank, get in the way of accessibility, and generally damage the user experience. These drawbacks are often also true of many libraries that deal with scroll behaviors, whether that’s parallax effects, or other scroll-coupled animations. Having a library to do smooth scrolling is going to be something that has to be kept up-to-date and maintained, and it will add to the overall page weight of the site.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |