Dev News: Astro 3.0, State of CSS, and React Opinions
“View Transitions are a set of new platform APIs that unlock native browser transition effects between pages,” the release note explained. “Historically this has only been possible in Single Page Applications (SPAs), but web browsers and spec authors have been working hard over the last few years to bring native page transitions to the platform, and Astro 3.0 is the first web framework to bring them to the mainstream.”
- Morph persistent elements from one page to another;
- Fade content on and off the page for a less jarring navigation;
- Slide content on and off the page; and
- Persist common UI across pages, with or without refresh.
“The best part about View Transitions in Astro is how simple they are to use. With just 2 lines of code, you can add a subtle — yet tasteful! — fade animation to your site,” the release notes stated.
Other updates include:
- Image optimization;
- Astro components render 30-75% faster;
- SSR Enhancements for serverless, which means new ways to connect to the hosting platform;
- HMR Enhancements for JSX, which means fast refresh support for React and Preact; and
- Optimized Build Output with cleaner and more performant HTML.
State of CSS: CSS-in-JS Trend Plateaus
The report also found that newcomer Open Props has generated a “small but passionate” following that’s eager to retain the framework. Open Props, which became available in May, was created by Adam Argyle, a Google software engineer who is also the creator of Tailwind CSS.
Meanwhile, Bootstrap is the most used framework, which is interesting because it also had the most developers (at 41%) who said they would not use it again. Tailwind ranked as the major CSS framework that developers are happiest to keep using.
That’s Just, Like, Your Opinion, Man
An unopinionated framework doesn’t dictate how developers structure their code or use third-party libraries, he explained. React has taken steps toward being opinionated, such as using folder trees as routers, he contended.
“For example, the official React documentation now recommends using Next.js or Remix for server-side rendering (SSR),” Hoffnan wrote. “These frameworks provide a number of features that can help developers build more efficient and scalable React applications, but they also come with a set of opinionated choices about how code should be structured and organized.”
He theorized this may be a maturity issue, since there’s now a wider range of third-party libraries and tools available. This adds to the appeal of creating an opinionated framework, which simplifies finding tools.
“Another reason for React’s increasing opinionatedness is that companies are increasingly looking for ways to reduce development costs and time to market,” he wrote. “Opinionated frameworks can help to achieve these goals by providing developers with a pre-configured set of tools and libraries that are known to work well together.”