JEM - Web in February - JavaScript Every Month Newsletter
Embrace the AI agent revolution to supercharge your programming skills with practical tools!
It's an AI revolution, specifically an AI agent revolution. Do you use AI in your everyday programming? You should. It can be challenging to train and prompt, but once you get the hang of it, it works wonders. Treat it like Google; you need to understand how to ask the right questions to get the best answers. The same applies to LLMs; you must practice to discover their full potential.
Even if your company isn't sponsoring it, it's not hard to start today.
- Github Copilot provides free limited access
- Gemini code assist has free credits
- Mistral Codestral is free.
- Windsurf provides you credits to get started.
Releases
Browsers
Firefox 135
- Support for JSON parse with source proposal
PublicKeyCredential.getClientCapabilities()static method is supported, allowing a web app to check if a browser enables particular WebAuthn capabilities and extensions without having to resort to user agent sniffingTemporal APIin the nightly release.
The major news from Firefox release has been changes to their privacy policy.
- Github diff on the change.
- The Firefox I loved is gone - how to protect your privacy on it now - ZDNet
- Mozilla explanation on the Terms of Use update
- Mozilla rewrites Firefox’s Terms of Use after user backlash - TechCrunch
Chrome 133
- support for
PublicKeyCredential.getClientCapabilities()- same as firefox - support for
popover=hintwhich have tooltip capabilities. attr()function support to Level 5 which allows types besides<string>and use in all CSS properties:openpseudo-class matches<dialog>and<details>when they are in their open state, and matches<select>and<input>when they are in modes which have a picker and the picker is showing.Animation.overallProgressprovides how far along an animation has advanced across its iterations and regardless of nature of its timeline.moveBeforeto move content while preserving state in the DOM.
Daisy UI 5
The popular Tailwind associated UI library is now v5.
- supports Tailwind v4
- zero dependencies
- 61% smaller in size
- micro css files available for No-Build projects
Adding memes with release updates is a nice touch 😂
Astro 5.3 & Astro 5.4
- Remove image optimisation
- Faster page rendering
- Automatic session storage setup
- More control over Netlify bundling
- Improved handling of HEAD requests
Next.js 15.2
- Redesigned error UI and improved stack traces
- Experimental support for React View Transitions
9ui
On our earlier Newsletter edition, we had noted an unstyled UI component library named BaseUI from creators of Radix, Floating UI and Material UI. 9ui is build on top of BaseUI - ie. it actually adds the style with Tailwind CSS. It looks 🪄.
ESLint officially supports linting of CSS
- CSS Linting under new package
@eslint/css
React native 0.78
- React 19 official support
- Added support for Android XML drawables
require(esm) Backported to Node.js 20
NodeJS 22 introduced require(esm), allowing for the development of ESM-only modules. However, many developers continued to use Node 20, slowing progress more than expected. A new PR has been added to Node 20, backporting the require(esm) behavior to this version. As support for Node 18 ends soon, this change will facilitate the creation of newer ESM-only modules.
In the Spotlight 🔦
This month, I pay tribute to the scaffolding tool that marked the beginning of my serious coding journey: Create React App. While I had developed JavaScript apps before, React was a revelation for me. CRA included a command for ejecting from its build setup when you outgrew it. By ejecting, I learned how webpack configuration works and experimented with it.
React team has deprecated Create React App and now recommends using a framework or build tool like Vite, Parcel, or Rsbuild. Although both options are available, the team clearly favors a framework. CRA has struggled to keep pace with React 19, particularly since the key feature of server components is not available in the official scaffolding tool.
I appreciate the choice of adopting a framework, and as I have mentioned before, I like the direction Tanstack Start is taking. Thank you for the memories, CRA! 👋
- CRA to Parcel - script to migrate non-ejected CRA app to Parcel.
- Create TanStack router app
In Short
- React native core contributor summit 2024 recap
- Angular documentary from Honeypot
- State of React native results
- SVG Filter Sticker Effects from Jhey Thomson - Codepen
Tutorials
How Preply improved INP on a Next.js application (without React Server Components and App Router)
Preply explains how they collaborated to enhance their INP (Interaction to Next Paint) web vital. This comprehensive guide outlines the steps they considered, provides a breakdown of their process, and details the benefits they gained from improving INP. Additionally, it discusses the decisions they made to avoid certain actions that did not align with their timeline.
TypeScript types can run DOOM - Michigan TypeScript
I'm not entirely sure if I should categorize this as a tutorial. However, someone has demonstrated that they can build and run DOOM using only TypeScript types. The video provides a walkthrough of their process. There are also other videos on the channel where they introduce their creation to the TypeScript creator.
React.js Performance Guide - Sentry
Sentry's blog presents a list of common React performance issues and their solutions. It clearly outlines the problems and the necessary steps to address them. Additionally, it includes tools to assist in the process.
Designing backgrounds with LLMs and React
Most tutorials today are about developing entire apps with LLMs. But this one's about creating a background component with LLM prompting and making it creative.
Artistic components are perfect for AI: they're isolated, they can't cause serious damage, and you can verify the logic by looking at the result.
Faux Containers in CSS Grids
This is a short tutorial on breaking elements out of grid using, you guessed it CSS grid. Even though it seems simple, I hadn't thought about putting a pseduo element on the grid before!
In Other News
Best devices at Mobile World Congress
Companies don't launch devices at MWC (or any trade fairs for that matter) to avoid getting lost in the noise. However, it remains a platform for showcasing concept devices and demonstrating innovation.
- World's skinniest phone
- Foldable display handheld
- Lens that attechs itself to the back of the phone with magnetic pins
- Phone which doubles up as a speaker and more.
I tried to prove I'm not AI - Howtown
Adam Cole and Joss Fong recently launched a YouTube channel, but viewers began to complain that it resembles an AI channel. In a world where AI can generate text, images, audio, and video—essentially everything online—how can you prove that you aren't AI? Howtown seeks to uncover the answer.
Boom unveils ‘Boomless Cruise’ for quiet supersonic travel
Supersonic flight is a regrettable example of technology that once thrived but has since vanished. We had the Concorde operating commercial flights until an accident and the issue of sonic booms led to its retirement. The economics of such flights ultimately proved unviable.
However, that is in the past. Today, multiple companies are pursuing the promise of boomless supersonic flights. The most notable among them is NASA, in collaboration with Lockheed Martin. Another key player is a private company named Boom, which ironically aims to eliminate the very boom they are named after; they have recently unveiled their first prototype.
- This plane could cross the Atlantic in 3.5 hours. Why did it fail? - Vox
- Supersonic Planes are Coming Back (And This Time, They Might Work) - Wendover Productions
- NASA Is Bringing Supersonic Planes BACK - Cleo Abram
- XB1 - First Supersonic Flight Boom
AI Updates
- Claude 3.7 Sonnet and Claude Code
- Wanx AI - Alibaba's video generation model.
- Alexa Plus - The first AI home assistant has been announced but we don't know when it will come out (remember Apple Intelligence?)
- Lex Fridman's podcast on AI touching on AI techniques, Deepseek, Megaclusters and open source AI is a 5 hour long gem.
- First diffusion based text LLM Mercury ⚡
Looking Ahead
- FOSS Asia - March 13-15
- React Paris - March 20-21