Friday Issue Nr. 122 | 25/10/2024

This post has loads of diverse news, so hopefully, you will find something to read and enjoy! Svelte and Zustand produced their v.5, Chrome Dev Tools has AI, Wes Bos inspected an old but super fast website, and then there is that CSS survey out, too, and a few more exiting reads.

JavaScript News

Svelte v5.0

Well, that took some good time, but hey, slow is smooth and smooth is fast, right?

https://svelte.dev/blog/svelte-5-is-alive

TanStack Start

The full stack React framework is powered by TanStack Router. Could this substitute NextJS?

https://tanstack.com/start/latest

Zustand v5.0

https://github.com/pmndrs/zustand/releases/tag/v5.0.0

Node v23

It feels like I only noticed Node 18 yesterday.

https://nodejs.org/en/blog/release/v23.0.0

Chrome DevTools AI

Addy Osmani introduce AI assistance in Chrome Dev tools.

https://x.com/addyosmani/status/1847191537530425814

Wicked fast

Wes Bos talks about the McMaster Carr website, which is probably built with ASP.NET and Yahoo 2008 JS library, and works super fast. Really fun to watch and I promise you will have your Aha moment(s) in those 13 minutes.

https://www.youtube.com/watch?v=-Ln-8QM8KhQ

How to structure your React App

https://www.robinwieruch.de/react-folder-structure/

OpenFreeMap

“For a long time, when you wanted to use the map on your website or app, you had to look for a commercial map tile provider and hope your site didn’t become too popular. Otherwise, you might end up with a $10,000 bill in a single day…”

“There is no tile server running; only nginx serving a Btrfs image with 300 million hard-linked files.”

https://openfreemap.org/

How to Build an Image Search Application With OpenAI CLIP & PostgreSQL in JavaScript

https://www.timescale.com/blog/how-to-build-an-image-search-application-with-openai-clip-postgresql-in-javascript/

Library to animate SVG text

https://github.com/Amer-Jabar/khoshnus

HTML & CSS News

The State of CSS 2024 survey results

As per the survey, the top three favourite features are: has(), @Container, CSS Nesting - no surprises here. Also, to my surprise, TailwindCSS is the most popular CSS framework (75%) but also the second biggest pain point related to CSS (5%).

https://2024.stateofcss.com/en-US/

Shadcn component library

This looks like a pretty solid component library with support for Next.js, Vite, Remix, Astro, Laravel, and Gatsby. You can also add dependencies manually.

https://ui.shadcn.com/

Tree counting and Random values

A great example of future CSS (also possible somehow today)

https://kizu.dev/tree-counting-and-random/

HTML is hard

I hardly ever use any blockquotes, and apparently, there are nuances.

https://css-irl.info/ive-been-doing-blockquotes-wrong/

Experiment with CSS min()

https://www.smashingmagazine.com/2024/10/css-min-all-the-things/

HTML for people

This adorable website is for those who have yet to work with HTML and want to learn the basics before creating their first website.

https://htmlforpeople.com/

Mixed News

Solar powered hosting

Something for a Friday morning with a big cup of coffee.

https://solar.dri.es/

The parallel evolution of React and Web Components

I wasn't sure if I should add this to the JavaScript or Mixed News section, but since it is not only a massive long read but also quite philosophical, I added it here.

“Effectively, as soon as you try to do meaningful work with React, the “unidirectional data flow” ceases to be an architecture and becomes an origin myth. Meanwhile the actual architecture is whatever uncoordinated “I can’t believe it’s not MVC” hocus pocus is popular in the React scene the week the project was started.”

It's a very long read, but a good one! Although there is some negativity against React, it goes deep into the state of the web and finishes with the good parts, like the View Transition API, Import Maps, Container queries, the Popover API, and more.

https://www.baldurbjarnason.com/2024/liskovs-gun

Comment on Mastodon