--- title: "19 Web features getting broader support in 2025" publication: "Frontend Focus" issue: 680 published_at: "2025-02-19" canonical_url: "https://frontendfoc.us/issues/680" --- Plus ESLint now lints CSS too, JS framework HTML defaults, and a library to observe CSS property changes. | 🤓 Your usual editor Chris is away enjoying the Caribbean heat this week, so I, the editor of [JavaScript Weekly](https://javascriptweekly.com/), get to step in and nerd things up a bit! I always love catching up with things browser-side, let's see how it goes! __ _Peter Cooper, your temporary editor_ Together with [![Frontend Masters logo\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_300,h_70/e_make_transparent/co_white,e_outline:5/nk0tfdvalivacz8rw7rt.png)](https://frontendmasters.com/courses/pro-css/?utm_source=email&utm_medium=frontendfocus&utm_content=procss) 🚀 **Frontend** Focus #​680 — February 19, 2025 | [Read on the web](https://frontendfoc.us/issues/680) [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/v1739534560/npzilkaxpjcjl0uletyp.jpg)](https://wpt.fyi/interop-2025) [Launching Interop 2025](https://hacks.mozilla.org/2025/02/interop-2025/) — This year’s Interop project (an ongoing cross-browser effort to increase interoperability of key web platform features) features 19 focus areas including **CSS anchor positioning, Core Web Vitals, the View Transition API, and WebAssembly.** You can see the full list, with explanations, [in the Interop repo](https://github.com/web-platform-tests/interop/blob/main/2025/README.md) and monitor progress on [this dashboard](https://wpt.fyi/interop-2025). The WebKit team has shared [a blog post going into even more depth](https://webkit.org/blog/16458/announcing-interop-2025/) and the Microsoft Edge team [gives its take too.](https://blogs.windows.com/msedgedev/2025/02/13/microsoft-edge-and-interop-2025/) James Graham [![\](https://res.cloudinary.com/cpress/image/upload/c_limit,w_480,h_480,q_auto/copm/737ed7cd.png)](https://frontendmasters.com/courses/pro-css/?utm_source=email&utm_medium=frontendfocus&utm_content=procss) [Write CSS Like a Pro](https://frontendmasters.com/courses/pro-css/?utm_source=email&utm_medium=frontendfocus&utm_content=procss) — Kevin Powell shares how to create a responsive website from scratch using modern CSS features (such as nesting, utility classes, custom properties, and more). This detailed video course also dives into adding additional polish via animations, view transitions, and more. Frontend Masters sponsor [Three Approaches to the `&` Selector in CSS](https://frontendmasters.com/blog/three-approaches-to-the-ampersand-selector-in-css/) — The `&` selector in vanilla CSS, now supported via [CSS Nesting](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_nesting/Using_CSS_nesting), allows nesting styles within a parent selector without needing preprocessors like Sass. Here’s a look at some of the nuances behind its use. Preethi Sam ⚡️ IN BRIEF - 🔎 [ESLint now officially supports linting CSS.](https://eslint.org/blog/2025/02/eslint-css-support/) - 🤓 Back in the 90s, it was common to include 88x31 sized GIFs on sites to promote or indicate various things and [there's a collection of 4000+ of them here.](https://cyber.dabamos.de/88x31/) - ⚓︎ [Anchoreum](https://anchoreum.com/) is a 40-level online experience for learning about CSS anchor positioning. - 🆕 A look at some of the [accepted feature suggestions for Firefox](https://connect.mozilla.org/t5/ideas/idb-p/ideas/status-key/accepted) that are being actively worked on. - 🔠 Some updates on [how Microsoft has improved Chromium/Edge text rendering](https://developer.chrome.com/blog/better-text-rendering-in-chromium-based-browsers-on-windows?hl=en) on Windows recently. - 📊 [The results of the _State of React 2024_ survey](https://2024.stateofreact.com/en-US) are now out. 📙 Articles, Opinions & Tutorials [Learning How to Build Modern Web Extensions](https://chenhuijing.com/blog/learning-web-extensions/) — It’s easy to run into outdated docs when building extensions. Lucky for us, Hui has been through the process recently and shares some tips. Hui Jing [Testing 10 JavaScript Frameworks on Their HTML Defaults](https://meiert.com/en/blog/javascript-framework-html-defaults/) — Using a JavaScript framework is now ‘the way’ for many Web site developers, but how do the popular options fare at producing valid, error free HTML? Jens Oliver Meiert [Protect Against Bots, Fraud, and Abuse in Real Time](https://workos.com/radar?utm_source=cpfef&utm_medium=newsletter&utm_campaign=q12025) — WorkOS Radar protects your app with advanced device fingerprinting — stop fake signups, free tier abuse, bot attacks and brute force attempts today. WorkOS sponsor [Decoding CSS Selectors: `:has(:not)` vs `:not(:has)`](https://polypane.app/blog/decoding-css-selectors-has-not-vs-not-has/) — When you combine CSS functions, the nesting matters - a lot. Polypane [Using the `step` and `pattern` Attributes to Make Number Inputs More Useful](https://piccalil.li/blog/using-the-step-and-pattern-attributes-to-make-number-inputs-more-useful/) Cassidy Williams [Using `Intl.DurationFormat` for Localized Durations](https://www.raymondcamden.com/2025/02/13/using-intldurationformat-for-localized-durations) Raymond Camden [Understanding the Tradeoffs of Using Tailwind CSS](https://measured.co/blog/tailwind-trade-offs) Scott Boyle [The `attr()` Function in CSS Now Supports Types](https://www.amitmerchant.com/attr-function-types-css/) Amit Merchant [How I Migrated from WordPress to Astro](https://itsthatlady.dev/blog/migrate-from-wordpress-to-astro/) That LadyDev 🧰 Tools, Code & Resources [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/lobuc80xxqp4gb8f7eg3.jpg)](https://lea.verou.me/blog/2025/style-observer/) [StyleObserver: A Library to Observe CSS Property Changes](https://lea.verou.me/blog/2025/style-observer/) — An exhaustively tested JS library from Lea Verou, designed to observe any changes to CSS properties, and deftly deflecting a mass of relevant browser bugs along the way. [Project homepage.](https://observe.style/) Lea Verou [Run GitHub Actions Up to 2x Faster at Half the Cost](https://blacksmith.sh/?utm_source=cooperpress&utm_medium=secondary&utm_campaign=feb14&utm_term=frontend) — Blacksmith runs GitHub Actions up to 2x faster at half the cost. Trusted by 250+ companies like Ashby and Clerk. Blacksmith sponsor [LaLoka Layouts: 30+ Useful Components Built with Tailwind](https://layoutsfortailwind.lalokalabs.dev/) — Includes components not normally included in these types of component sets. For example, various fixed position elements, input add-ons, along with standard options like avatars and cards. LaLoka Labs [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/xv4hsridujp1n5xgcktk.jpg)](https://www.william-troup.com/heat-js/) [Heat.js: A Heat Map Visualization Library](https://www.william-troup.com/heat-js/) — Think like the GitHub contributions heat map. No dependencies, small, responsive, and themeable. There’s a [live demo](https://www.william-troup.com/heat-js/examples/buttons.html) or its [GitHub repo.](https://github.com/williamtroup/Heat.js) William Troup [scroll-snap 5.0: A Customizable Scroll Snap Implementation](https://github.com/lucafalasco/scroll-snap) — Uses `requestAnimationFrame()` for 60fps scrolling performance and doesn’t have any dependencies. [Try it here](https://lucafalasco.github.io/scroll-snap/). Luca Falasco [tailwind-merge 3.0: Efficiently Merge Tailwind CSS Classes without Conflicts](https://github.com/dcastil/tailwind-merge) — Provides a way to merge Tailwind CSS classes from JavaScript without style conflicts. [v3.0](https://github.com/dcastil/tailwind-merge/releases/tag/v3.0.0) is notably Tailwind CSS v4 _only_ so don’t upgrade if you haven’t upgraded Tailwind CSS first. Dany Castillo [dash.js 5.0: JS Implementation of MPEG DASH Playback for Browsers](https://dashif.org/dash.js/) — A reference client implementation for the playback of MPEG DASH (Dynamic Adaptive Streaming over HTTP) via JavaScript in browser based environments that support the Media Source Extensions. [GitHub repo.](https://github.com/Dash-Industry-Forum/dash.js) Dash Industry Forum [ts-audio: Simple API for AudioContext and Playing Audio Playlists](https://github.com/EvandroLG/ts-audio) — [Here’s a demo.](https://codesandbox.io/s/ts-audio-playlist-ovynj) Evandro Leopoldino Gonçalves 📰 Classifieds Choosing the wrong PDF SDK will slow you down. Bugs, missing features, and poor support cost months of dev time. [Try out Nutrient’s PDF SDK](https://www.nutrient.io/sdk?utm_campaign=issue-680-FF-2025-02-19&utm_source=cooperpress&utm_medium=sponsoring) in your environment and compare. Trusted by 10k+ developers. --- [Design Meets Development:](https://blog.bitsrc.io/my-experience-as-a-designer-working-at-bit-aa50e9d9f290?utm_source=FrontEndFocus&utm_id=20&utm_medium=newsletter) Amir Shalev shares his unique journey bridging the gap and seamlessly collaborating with developers using [Bit](https://blog.bitsrc.io/my-experience-as-a-designer-working-at-bit-aa50e9d9f290?utm_source=FrontEndFocus&utm_id=20&utm_medium=newsletter). ![](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/v1739446895/k1vjiuv2yetrmox1s3ll.png) 🔎 A focus on_WebGL and shaders_ - We've spotted a handful of great [WebGL](https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API) and GLSL articles, tutorials and demos over the past few weeks. So, if you've ever been wowed by some striking visual effects or 3D experiences on the Web, this section is for you: [How to Set WebGL Shader Colors with CSS and JavaScript](https://www.nmattia.com/posts/2025-01-29-shader-css-properties/) — Nicolas shares how we can use CSS (and some JS) to control WebGL shader colours in real-time via the canvas element. Nicolas Mattia Tutorial [VFX-JS: A JavaScript Library to Add WebGL-Powered Effects to Websites](https://amagi.dev/vfx-js/) — Allows you to easily add effects to regular image, video, and even div elements by means of a set of components exposed by the API. Jun Yuri Library [Particular Drift](https://particular-drift.netlify.app/) — A neat browser-based tool for turning images into flowing particle animations. The end result is rather awesome. collidingScopes Demo [ThreePipe: 3D on the Web Made Easy](https://threepipe.org/) — A layer that sits atop Three.js for making it even easier to create 3D web experiences and work with 3D scenes and objects. [Tons of examples.](https://threepipe.org/examples/) Repalash Library [How to Create a WebGL Rotating Image Gallery using OGL and GLSL Shaders](https://tympanus.net/codrops/2024/12/03/how-to-create-a-webgl-rotating-image-gallery-using-ogl-and-glsl-shaders/) Oluwaseyi Oluwadare Tutorial _Tip:_ If you're into the more visually striking side of Web design, [Codrops](https://tympanus.net/codrops/) is worth following generally – they've had a fantastic run of GLSL/shader, Three.js, and similar content recently. 📬 **Got a new email address?** You can [change your email here](https://frontendfoc.us/edit_subscription/*|UID|*). --- **Bored of us?** Click [here to stop getting this newsletter](https://frontendfoc.us/leave/*|UID|*). --- **Got a link for us?** Reply and tell us. We can't include everything but we'll take a look. --- Published by Cooper Press Ltd. Curated by [Chris Brandrick](https://mastodon.social/@brandrick) & [Peter Cooper](https://twitter.com/cooperx86). Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom [Stop getting this newsletter](https://frontendfoc.us/leave/*|UID|*) [Ipx.](https://frontendfoc.us/open/680/*|UID|*?ipx=t)