~javascriptweekly | Bookmarks (279)

browser-or-node 3.0: Figure Out Where Your Code is Running — Provides a simple way to tell if your code is currently running in a browser, in Node, in a Web Worker, or in Deno. Works with both ESM and CJS imports.

HTML Attributes vs DOM Properties — They’re different, but often coupled. Jake outlines the the difference, and why it matters.

▶  A Node.js Streams Masterclass — An hour-long odyssey with the creator of Fastify (and Node.js TSC member) into the world of streams. A stream is like an array over time.. we learn, before going into live coding and demos.

How I Fixed My Brutal TTFB (Time to First Byte) — All it took was two small changes to how data is fetched to reduce the p75 TTFB from 3.46s to just 704ms. Learn more.

📊 Unovis: A Modular Data Visualization Framework — Works with React, Angular, Svelte, Vue or plain old JS/TS. Handles all sorts of things from Sankey diagrams to maps, graphs, chord diagrams, and traditional line/area charts. The v1.4 release adds support for annotating visualizations in a flexible way. There’s a gallery of examples (with code) if you want to dig in.

ReScript 11.1 Released with Improved JSX Support — ReScript is an OCaml-inspired, typed language that compiles to JavaScript and has a JSX transform built into the language. JSX support was previously solely for React use cases, but now works with Vue, Preact, and other approaches too.

typed-xlsx: Feature-Rich Type-Safe Excel Reporting — Define a strongly typed spreadsheet schema, then populate and work with the sheets directly from JS/TS, such as for generating reports for users – example code. Wraps around SheetJS. GitHub repo.

Devalue 5.0: Like JSON.stringify, But.. — “Gets the job done when JSON.stringify can’t.” Namely, it can handle cyclical and repeated references, regular expressions, Map and Set, custom types, and more.

imask.js 7.6.0: A Vanilla JavaScript Input Mask — Prevent users from entering invalid values. Has plugins for Vue, Angular, React, Svelte, and Solid, as needed.

JSR is Not Another Package Manager — When Ryan created Node, JavaScript had no packages or standard module system. npm and CommonJS took off, and tools like Yarn or pnpm extended npm in certain areas, but in today's ES modules era, it’s time for a transformation. JSR is not merely a new npm, but a shift in how packages are distributed, tailored for the...

Node.js v22 (Current) Released — The newest, cutting edge, major version of Node lands with some key enhancements. v22 becomes the new ‘current’ release (becoming active LTS in October). It adds support for require-ing ESM, gets a built-in WebSocket client, upgrades to V8 12.4, and includes a task runner (e.g. node --run task_name). This blog post takes a closer look.

Lydia Hallie Tests Your JavaScript Knowledge — Challenge your core knowledge with 50 interactive quiz questions covering topics like the event loop, scopes and closures, classes and prototypes, garbage collection, and more. After each question, you'll get an in-depth visual explanation from Lydia to deepen your understanding of fundamental JS concepts.

pnpm 9.0: The Efficiency-Focused Package Manager — pnpm has long been a fantastic option for folks looking to save disk space and CPU cycles (or for its great monorepo support) while maintaining most of what makes npm great. v9.0 drops Node 16 and 17 compatibility, honors the packageManager field in package.json, makes some default config changes, and adopts Lockfile v9.

A Tale of Migrating a Project to Bun — Eric, an engineer at Render, walks through the steps of how he migrated his Sveld project to Bun (replacing Yarn and Vitest in the process), including some minor gotchas he encountered, and what the speed gains were.

The Frontend Developer/Engineer Handbook 2024 — A guide to the current webdev landscape, covering how to get up to speed on topics like editors, CSS, UX, UI, the command line, tools and frameworks, perf, accessibility, etc.

3 Reasons to Use JavaScript Libraries for Graph Visualization — Easily add network visualization capabilities to your applications, while cutting down on dev time.

Upgrading jQuery: Working Towards a Healthy Web — jQuery remains all over the Web, and the jQuery team and OpenJS Foundation have joined forces to make sure sites get up to date. Their 'Healthy Web Checkup' tool can tell you if the version of jQuery on a site is outdated (.. most likely 'yes' 😅).

Biome v1.7: Faster Formatting and Linting, Now Even Easier to Migrate To — Biome is an increasingly compelling, all-in-one JavaScript, TypeScript and JSX Prettier-compatible formatter and linter. v1.7 makes it easier to migrate to from ESLint and Prettier, can emit machine-readable JSON reports, and has some rule updates.

Qwik vs. Next.js: Which is Right for Your Next Web Project? — A point by point faceoff between Qwik vs Next.js and why the author thinks Qwik takes the gold medal.

CSS in React Server Components — An exploration of compatibility issues between React Server Components and CSS-in-JS libraries like styled-components.

Next.js 14.2 Released — Approaching its eighth birthday, Next.js has passed 1 million monthly active developers and landed a release with support for using Turbopack to improve local development, memory usage, CSS and caching optimizations, improved error messages, and more.

Otto 0.4: A JavaScript Parser and Interpreter in Go — A JavaScript parser and interpreter written natively in Go (yes, we have a newsletter for that) which could be of interest if you want to add scripting to Go apps.

Wedges: A Collection of UI Components for React — Built and used by the folks at Lemon Squeezy, this is a well thought, aesthetically pleasing set of Radix UI and Tailwind CSS based components. You can also download a Figma file of them to use when mocking up layouts. GitHub repo.

Airbnb's Extensive JavaScript Style Guide — It’s been years since we mentioned this popular, opinionated style guide, but it keeps getting little tweaks and repairs and remains a handy resource nonetheless.