A huge week for both Svelte and Next.js

#​710 — October 24, 2024

Read on the Web

JavaScript Weekly

Svelte 5 is Alive — The long awaited next major release of Svelte, the compiler-driven JS UI framework, is the “most significant release in the project’s history”, while remaining largely backwards compatible. A big addition is runes for explicitly declaring reactive state, but there’s much more besides. The official svelte.dev site has also undergone a big rebuild to act as an ‘omnisite’ for all things Svelte.

The Svelte Team

📺 If you want to see how to use Svelte 5, Syntax‘s Scott Tolinski has released ▶️ a 2 hour Svelte 5 basics course on YouTube.

FlexGrid by Wijmo: The Industry-Leading JavaScript Datagrid — A fast and flexible DataGrid for building modern web apps. Key features and virtualized rendering are included in the grid module. Pick and choose special features to keep your app small. Built for JavaScript, extended to Angular, React, and Vue.

Wijmo From MESCIUS inc sponsor

GenAIScript: Microsoft’s Generative AI Scripting Environment — Microsoft is really poking at AI from all angles. TypeChat introduced a type-safe way to talk to LLMs; now GenAIScript offers a JavaScript-powered way to programmatically assemble prompts and process responses. They claim it “brings essential LLM prompt tooling into a cohesive scripting environment.”

Microsoft

Next.js 15 Released — It’s a big week for the popular (some may even argue default) React framework with Next.js Conf starting today, as well as this release. It includes a codemod CLI for easier upgrading, async request APIs, alignment with React 19, and more.

Vercel

IN BRIEF:

Developer IDE firm JetBrains has announced its WebStorm JavaScript/TypeScript IDE is now free for non-commercial use which, notably, also covers paid content creators.

The popular shadcn/ui component library has unveiled a new suite of components for building sidebars.

⌚ Spectra is a hackable smartwatch seeking funding on Kickstarter (but it has passed its initial goal). ESP32-S3 based, it appears able to run JavaScript as shown in the ‘dev experience’ screenshots.

🙋 This year’s State of React survey is now open to take until November 19.

RELEASES:

⚛️ React Native 0.76 – A big release. The so-called ‘New Architecture’ is now used by default (so you can now use all the modern React features in RN too), the React Native DevTools are stable, and build times are faster than ever.

🥖 Bun is on a roll.. with three releases in the past week. v1.1.31 added support for node:http2 server and gRPC, v1.1.32 added Node’s crypto.hash method, and v1.1.33 was a bug-fix release.

Express.js 5.0 – Landed a few weeks ago, but now there’s an official post explaining the state of the project which has now passed a comprehensive third party security audit.

Medusa 2.0 – A Node.js-powered ecommerce platform.

React Compiler Beta, Turborepo 2.2, ESLint v9.13.0, Deno 2.0.2

📒 Articles & Tutorials

▶  Build a Sonic Infinite Runner Game Using Kaplay — A two hour walkthrough of using the Kaplay game library (formerly known as Kaboom.js) to build a complete, if simple, Sonic-branded game. You can also play it here.

JSLegendDev

New Wallaby 2.0 – Works with All Editors – A Massive Step Forward for JavaScript Testing — Experience faster JavaScript debugging, real-time insights, & enhanced coverage monitoring with Wallaby 2.0’s integrated UI.

Wallaby Team sponsor

Why I’m Skeptical of Rewriting JavaScript Tools in “Faster” Languages — Rewriting common JS infrastructure / build tools in ‘faster’ languages like Rust, Zig or Go has become popular in recent years, but is it necessary, asks Nolan?

Nolan Lawson

How to Create a Modern SPA with Django and Vue — If you can handle some Python in your life, Django is a powerful backend web framework and it’s quite happy to be paired up with a Vue.js frontend with GraphQL providing the glue.

The Dev Space

Learn How to Build a Full Stack Application Using React Native & Expo — Build a cross-platform full-stack app using a single codebase with scalable backend support and authentication.

Clerk sponsor

📄 Creating a 3D Hand Controller Using a Webcam, MediaPipe and Three.js Caio Bassetti

📄 How To Speed Up Your Vue App with Server Side Rendering Jakub Andrzejewski

📄 Angular’s Approach to Partial Hydration Loraine Lawson (The New Stack)

📄 Understanding npm audit and Fixing Vulnerabilities Niraj Chauhan

📄 Building a Mental Model of Node.js Streams Pavel Romanov

🛠 Code & Tools

match-sorter 7.0: Deterministic Best-Match Array Sorting — If you have an array of items you want to filter and sort ‘intelligently’ and deterministically, this offers a well-described, predictable algorithm. Play with a live CodeSandbox demo.

Kent C. Dodds

🤖 Transformers.js v3: Run Transformers in the Browser — A JS port of Hugging Face’s transformers Python library that can run natural language, vision, and audio machine learning models right in the browser. v3 adds WebGPU support for boosted performance and now supports Node, Deno and Bun too.

Hugging Face

Build Forms from JSON Using Drag & Drop UI — SurveyJS Libraries for Surveys & Forms — Integrate a JSON form editor with any backend. Enjoy complete control over your data with unlimited users and forms — no restrictions.

SurveyJS sponsor

Fetch Mock 12.0: Mock Requests by the fetch API — A flexible API for mocking HTTP requests made by fetch or fetch-imitating libraries. Supports browsers, Node, and web/service workers.

Rhys Evans

📊 Vizzu 0.14: A Library for Animated Data Visualizations — Making visualizations is one thing; animating them is much harder. Vizzu helps you create animated data stories and interactive explorers with a variety of showcase examples for inspiration.

Vizzu Inc.

eslint-plugin-functional: Rules to Promote Functional Programming — This isn’t for me, but if you want to encourage (or even force) a lack of mutation and a use of FP techniques in your codebase, this could be for you.

Jonas Kello

Radix Vue: Unstyled, Accessible Components for Vue.js — An unofficial Vue port of the popular Radix UI component library. GitHub repo.

zernonia et al.

Edge.js v23 – Run .NET and Node.js code in one process on Windows, macOS and Linux.

✂️ Knip 5.34.0 – A neat way to find and tidy unused stuff in your projects.

🧊 PlayCanvas glTF Viewer 5.0 – 3D model viewer supporting glTF 2.0 and PLY.

🗓️ React Date Picker 7.5 – Simple date picker component. (Demo.)

🤖 ml.js 8.0 – Machine learning tools in JavaScript.

MDX 3.1 – Write JSX in your Markdown documents.

📰 Classifieds

Meticulous automatically creates & maintains E2E UI tests. Zero flakes. Used by Lattice, Bilt Rewards and others.

SupaHooks: An Outbound Webhooks Template for Next.js.

⚙️ Create entire web apps with Reactile and let it handle your widgets and windows within a single browser tab. 1-month free trial. Try it now.