Bookmarks (216)

Learn Yjs and Building Realtime Collaborative Apps in JavaScript — Yjs is a CRDT (Conflict-free replicated data type) library for building collaborative and local-first apps. CDRTs are powerful but can be tricky to ‘get’ which is why this new interactive Yjs tutorial is so valuable. A great way to learn about building collaborative, syncing webapps from the ground up.

Node Web Audio API 1.0: A Web Audio API Implementation for Node — More accurately, it’s a set of Node bindings for a Rust-powered non-browser implementation of the Web Audio API.

🔎 file-type 20.0: Detect the File Type of a File, Stream or Data — For example, give it the raw data from a PNG file, and it’ll tell you it’s a PNG. Uses a ‘magic number’ approach so is targeted at non text-based formats. v20 adds support for yet more formats, including JARs, Word/Excel templates, and now supports ZIP decompression.

react-nil 2.0: A React 'Null Renderer' — An interesting experiment to use React in situations where you don’t need it to render anything, but you want to use hooks, suspense, context, and other bits of the React lifecycle. Like in, say, a Node app. Maybe this CodeSandbox example will provoke some ideas.

♟️ Chess.js: A Library to Manage a Chess Game — Provides move generation, validation, piece placement, check/checkmate/stalemate detection – "everything but the AI!" v1.0 offers a rewrite to TypeScript and a variety of enhancements.

Revealed: React's Experimental Animations API — <ViewTransition /> is based on the browser's View Transition API. It’s only in pre-release versions of React, but Matt is armed with examples for you to get a feel for the potential.

Five Years of React Native at Shopify — Five years ago, Shopify said React Native was the future for mobile development at their company and they meant it, with every mobile app moving to RN over time. Here’s what they learnt along the way and why they’re sticking with it.

Write More Maintainable JavaScript with AI Code Reviews — CodeRabbit is your AI-powered code review companion that deeply understands the JavaScript codebase. Free for open source.

Accessibility Essentials Every React JS Developer Should Know — If you’re an experienced frontend developer, these might be second nature to you by now, but this is a good roundup of the entry level ‘table stakes’ for frontend accessibility, whether using React or not.

A Look at Regular Expression Pattern Modifiers — You may be familiar with using flags to change the behavior of regexes, but Dr. Axel looks at a proposal bringing a way to change regex flags within subexpressions (e.g. /^[a-z](?-i:[a-z])$/i;). It’s at stage 4 and should land in ECMAScript 2025.

A Checklist for Your tsconfig.json — What I love about Dr. Axel is when he’s done the hard work of figuring something out for himself, he writes it down. So it goes here, with his journey to set up a good tsconfig.json for his projects.

Protect Against Bots, Fraud, and Abuse in Real Time — With WorkOS Radar you can detect, verify and block harmful behaviour, protecting your app with advanced device fingerprinting. Stop fake signups, stop free tier abuse, and stop bot attacks and brute force attempts today.

Bun v1.1.44: The Fast JS Runtime Adds On-Demand Frontend Bundling — The popular, high-performance alternative JavaScript runtime has extended its Bun.serve() HTTP handler with support for bundling frontend apps on demand using HTML imports.

Introducing @smoores/epub: A Package for Working with EPUB Files — EPUB is a popular e-book file format and this new library provides a way to both read and write them. npm package link.

⭐ 2024's JavaScript Rising Stars — It’s time to fully wave goodbye to 2024, but not before Michael Rambeau’s annual analysis of which JavaScript projects fared best on GitHub over the past year. Even if you dislike GitHub stars as a metric for anything, this remains a great way to get a feel for the JavaScript ecosystem and see what libraries and tools have mindshare...

A Look at Import Attributes — It’s always a pleasure to see Dr. Axel blogging about JavaScript again, and he’s back with one of his typical deep dives into a newer ECMAScript feature: import attributes. This feature provides an inline syntax for attaching metadata to module imports such as for importing non-JavaScript modules (e.g. JSON, WASM or CSS).

How to Enable End-to-End Testing with Synthetic Monitoring — Synthetic Monitoring helps you launch new features with confidence and speed. Learn how you can create robust end-to-end test suites, spend less time on false positives, and proactively catch errors before they get to production.

Node’s New Built-in Support for TypeScript — Node.js v23.6.0 (Current) has just been released and makes Node’s new type-stripping features work by default, so you can just run node file.ts and it Should Just Work™. Dr. Axel explains how it works and what the limitations are.

The Future of htmx — htmx is an increasingly popular way to enhance HTML and actually write less JavaScript on the frontend. This post reflects on how htmx would like to be ‘the new jQuery’, not least in the sense that one of the project’s goals is to push the ideas of htmx into the HTML standard itself, as in this set of proposals.

You Don't Need Next.js — As much as Next.js is considered the React meta-framework of choice, if your requirements are modest, simply going with plain React offers numerous benefits in terms of simplicity and speed, as seen here.

Introducing Clerk SDKs for Vue and Nuxt — Official @clerk/vue & @clerk/nuxt SDKs for authentication integration with pre-built UI components in Vue/Nuxt apps.

Using TypeScript Without Build Tools — Chris Coyier enjoys the benefits of TypeScript while developing, but actually compiling it to JavaScript in various scenarios is less endearing. We’ve learnt (above) that Node can now run .ts files directly, but what other projects support the use of TypeScript without build tools?

PostalMime: A Universal Email Parsing Library — An email parsing library happy in most JS runtimes. Takes the raw source of emails and parses them into their constituent parts.

trimMiddle(): The Missing String Trim Method? — If you’ve got a long string and want to keep the start and end and truncate in the middle, this is for you. There’s a live demo here and GitHub repo.

Tipex: An Advanced Rich Text Editor for Svelte — Based on the popular Tiptap editor framework, it’s customizable, has theming support, and is Svelte 5-ready. Here’s a live example.

React-Toastify 11: In-Page Notifications Made Easy — There’s an elaborate demo page here but essentially it’s a flexible, easy to style ‘toast’ style notifications system with many years under its belt. GitHub repo.

Electrobun: A New JS Cross-Platform Desktop App Toolkit — A fresh take on the concept covered by Electron and Neutralinojs, except based around Bun. It’s early days, though, with only ARM-based Macs supported for now.

Tagify 4.33: An Elegant Input Component for Tags — The polished demos show a lot of effort has been put in here. GitHub repo.

8. How Google Handles JavaScript In Its Indexing Process — At one point if you wanted Google to index your content it needed to be directly written in HTML and not dynamically rendered with JavaScript. Things have since changed, of course, but by how much?

2. JavaScript Visualized: Promise Execution — A well-diagrammed article coupled with an (optional) 8 minute video that went into how promises work under the hood. Hugely popular as most of Lydia's content tends to be.

WorkOS: Sell to Enterprises with a Few Lines of Code — The modern identity platform for B2B SaaS, offering flexible, easy-to-use APIs to integrate SSO, SCIM, and FGA in minutes instead of months.

1. console.delight — By far our most popular link of the year with over 20,000 clicks(!) – but who doesn't use and love console.log? This post showed us how in the browser console it's not merely for printing plain text, but can be used to render things like SVGs and HTML.

Boost Semantic Search with MongoDB Atlas Vector Search — Create embeddings, index them, and run semantic queries—just follow the quick start tutorial.

Introducing Authentication Support for React Router — Add authentication and authorization to your React Router application in minutes with pre-built components and more.

Complete Intro to React v9: New Project, Modern Stack — Join Brian Holt in building a pizza delivery app from scratch. Master hooks, TanStack Router, testing, and React 19 features in this comprehensive guide to modern React development. No prior React experience needed.

The State of JavaScript 2024 Results — We recently encouraged you to take the annual State of JavaScript survey; the results are now out. 14,015 folks took part and we get to see what language features folks are using, experiences with popular libraries, build tool popularity, AI preferences, popular podcasts, runtime usage, and perhaps controversially, how more JavaScript developers are using TypeScript than not....

3. Is htmx Just Another JavaScript Framework? — Despite being five years old, htmx has seen a surge in popularity in 2023 and 2024, partly due to framework fatigue, but also as its simple HTML-oriented approach to adding functionality to pages appeals to a diverse group of developers. v2.0 landed in June.

4. Ecma International Approves ECMAScript 2024: What’s New? — In June, the Ecma General Assembly approved the latest ECMAScript / JavaScript spec, officially making it a standard. As with ES2023, it was a reasonably small step forward, but Dr. Axel rounded up what was new.

6. Eloquent JavaScript: The Fourth Edition — Coming several years after the third edition, the latest version of what is, perhaps, the best ‘all rounder’ book for learning JavaScript arrived in March “adjusted to the realities of 2024 and generally touched up.”

7. 33 JavaScript Concepts Every Developer Should Know — A curated collection of links to tutorials on 33 different areas it’s worth understanding well, including types, closures, equality, scope, and different engines.

Rockpack 5.0: An Alternative React App Starter — A Create React App-style tool aiming to get React project setup time as low as possible, complete with server side rendering support, bundling, linting and testing. GitHub repo.

Get Cooking! Generative AI with MongoDB — See how MongoDB, the world’s most popular document database, integrates with RAG pipelines and cutting-edge AI agents.

Boa v0.20: An Alternative JavaScript Compiler — Under development for several years, Boa has a few missions: be a Rust ECMAScript implementation, be easy to embed in Rust projects, and be a fast, safe JS engine overall. v0.20 sees a bump up to 89.92% compliance in the Test262 suite, improves Temporal support, adds Atomics.pause, and more. This is no toy engine.

How to Build a SolidJS App with Deno — SolidJS is a declarative library for creating user interfaces that emphasizes fine-grained reactivity and minimal overhead and it plays well with Deno.

How to Reduce TTFB? — High "time to first byte" affects web vitals. Learn to identify and fix issues slowing your TTFB.

The State of Node.js Performance in 2024 — A thorough set of benchmarks covering recent performance advancements made in Node.js. The improvements between Node 18 and 20 up to version 22 might surprise you - it’s clear the team has put a lot of work into this area.

Build with Gemini at Lightning Speeds — With the largest context window available, Google Gemini provides JavaScript developers multimodal processing of images, videos and text. Start using Google Gemini in minutes using AI Studio.

React v19 Now Stable — First teased in a February 2024 update, React 19 has been in beta for 8 months, so there’s already a wealth of content about it, from the React 19 upgrade guide or an explanation of its compiler to cheat sheets and Vercel’s roundup of what’s new in React 19.

Civet 0.9: Code More with Less Using a TypeScript Superset — Two years old and well maintained, Civet offers an interesting approach. Think JavaScript but with Python style indentation, chained comparisons, built-in JSX, & more. This example alone shows off the potential for tighter, easier-to-write code.