Don't Use JS for That: Moving Features to CSS and HTML
summary
Concrete demos show replacing JS with built-in primitives: styled toggles using checkbox checked and the new switch attribute (Safari), datalist and input[type=color] for suggestions and pickers, smooth scrolling via scroll-behavior with prefers-reduced-motion, details/summary accordions, and dialog using showModal/top layer/backdrop plus starting-style for animations. Also covered are container queries, field-sizing, the experimental select list, scroll-driven animations, and conditional logic via the :has selector. Accessibility tradeoffs and when small JS still helps are demonstrated.
AI-written summary · about
chapters (8)
- 0:00Introduction
- 3:41Least power in web dev
- 5:28Custom switches without JS
- 16:00Smooth scrolling with CSS
- 21:38HTML accordions and dialogs
- 29:11Container queries and has selector
- 31:40Field sizing demos
- 33:29Scroll animations and conclusion
related talks
30mStop using JS for that: Moving features to CSS and HTML
36mStop using JS for that: moving features from JS to CSS & HTML
40mStop using JavaScript for that - Moving features from JS to CSS and HTML
31m"Stop using JavaScript for that: moving features from JS to CSS and HTML"
39mYou Don’t Need JavaScript for That
57mDo It With Style: Rethinking CSS
41mBack to the future: of web development
18mJavaScript Is Dead: 7 Examples Where Modern CSS Is Enough