"Classical" carousels huge libraries could be easily replaced by native scroll functionality. This would contribute to grater UX, better performance and progressive enhancement approach.
You probably know that scroll is very complex functionality that very hard to implement without access to native OS API. That's why native scroll is more comfortable for the user (on modern desktop and mobile) than any point-and-click functionality.
Carousel in most cases could be substituted with horizontal scroll view, but in classical "carousels", you are expected some snapping of scrolling.
And it has been 3 years or so when this API available for browsers.
- Progressive enhancement, basic functionality available without JS
- Responsive
- LTR and RTL directions support
- AAA ARIA accessibility (focus of elements and visibility for AT)
- Could be controlled from keyboard (tab, arrows), mouse, touch etc. without any JS logic (Chrome has bug with arrows navigation)
- Scroll up to all elements, not just 1 at the time
Could be implemented but would be performance fall. Since it based on scroll we have boundaries of the list.
As progressive enhancement supports in every browsers from Netscape navigator 1.0 to latest Firefox.
Progressive enhancement and graceful degradation:
- if no JS available it would be just native scroll;
- if scroll snap CSS API available it would be snapped to declared values;
- if JS and snap scroll available than user will have Buttons and pagination functionality improvements over native scroll.
With polyfill tested:
- FF (68.0), Chrome (75.0.3770.142) Linux
- FF (68.0), Chrome (75.0.3770.142) MacOS
Note! Each OS and OS preferences resulted on different, but always familiar scroll behavior.
Safari 12.1.1 not work smooth scroll (could be polyfiled) Edge not work smooth scroll 11 not work smooth scroll
MIT D.Nechepurenko 2020