Vite 4.0 released

#​618 — December 9, 2022

Read on the Web

JavaScript Weekly

Vite 4.0 Released — From the same creator as Vue.js, Vite is an exciting piece of frontend tooling offering lots of goodies out of the box: fast hot module replacement, instant server starts, optimized builds with Rollup, TypeScript and JSX support (more on why to use Vite here). You can even give it a quick spin online via vite.new.

Evan You and Vite Contributors

Anjana Vakil on the JavaScript Fundamentals — This video course covers the core skills needed to become a professional JavaScript programmer, including writing reusable code with functions, conditionals, fetching data from APIs, and more. It’s everything you need to continue your journey to become effective at JavaScript.

Frontend Masters sponsor

npm Gains New Security Features — GitHub continues its work in making the npm ecosystem safer. Two new things: granular access tokens so package owners can better control access to publishing workflows, and a new code explorer to look directly at the contents of packages from the official npm site.

Monish Mohan (GitHub)

Console Ninja: console.log Output Right Next to Your Code — A VS Code extension that displays console.log output and runtime errors next to your code. Jack Herrington recorded ▶️ a neat 6 minute intro showing it off recently.

Wallaby.js Team

IN BRIEF:

There’s a React documentary in production – ▶️ here’s the trailer.

AWS has unveiled Step Functions Distributed Map, a way you can run hugely parallel (up to 10,000 simultaneous executions) operations (written in JavaScript, perhaps) over data and documents stored on S3.

A quick look back 27 years to the launch of JavaScript in 1995.

📊 D3 7.7, the latest version of the popular data visualization framework, is out and I wanted to recommend looking at co-creator Mike Bostock’s notebooks if you want inspiration on using D3, a look at new features, etc. He posts interesting stuff.

The JS debugger in the latest VS Code release now supports console.profile for CPU profiling code, as well as nested sourcemaps.

RELEASES:

Rome 11Linter in urbe novissima sunt.

Storybook 7.0 beta 0

Rollup 3.7 – ES module bundler.

xv 2.0 – Zero-config Node test runner.

Nx 15.3 (A huge news update post.)

Ember 4.9

Bun 0.3 – The challenger JS runtime.

📒 Articles & Tutorials

Sandboxing with PartytownPartytown provides a way to run third party scripts within a Web Worker rather than on the main thread. Could this be used for sandboxing? Weston tried it out and concluded it’s not quite there.

Weston Ruter

Build a Mobile-Responsive Telehealth Pager App Using Stream’s Chat API — Build a responsive chat app with emojis/reactions, built-in GIF support, ability to edit/delete messages, direct & group chat, and more.

Stream sponsor

Is Prisma Better Than Your ‘Traditional’ ORM?Prisma has become a very popular ORM option in the Node space in recent years. The creator of the Practica Node starter app considers if Prisma makes sense as a universal ‘go to’ ORM. No, but..

Yoni Goldberg

When to Use gRPC vs GraphQL — A balanced comparison of two popular API protocols to see where each works best.

Loren Sands-Ramshaw

Breakpoints and console.log is the Past, Time Travel is the Future — 15x faster JavaScript debugging than with breakpoints and console.log, now with support for Vitest.

Wallaby.js sponsor

▶  A Discussion on Optimizing Your JavaScript with Rust — A chat with Vercel’s Lee Robinson at the recent Next.js conference.

Ben Popper podcast

🛠 Code & Tools

Codux: A Visual IDE for React — One of the co-founders of Wix introduces a new standalone tool to accelerate the React development process. It currently only supports Chromium-based browsers but you can take it for a test drive or learn more from its homepage.

Nadav Abrahami (Wix)

Harlem 3.0: Simple Extensible State Management for Vue 3 — Provides a simple functional API for creating, reading, and mutating state.

Andrew Courtice

Open Source Firebase Alternative for Web, Mobile, and Flutter Devs

Appwrite sponsor

JS Image Carver: Content-Aware Image Resizer and Object Remover — Uses the seam carving approach (if you’ve used ‘Content Aware Scale’ in Photoshop, you’ve seen it). The live demo on this one is fun to watch.

Oleksii Trekhleb

Civet: The CoffeeScript of TypeScript? — If you liked CoffeeScript back in the day, here’s the same idea in a modern TypeScript-oriented form.

Daniel Moore

Maska 2.1: Zero-Dependency Input Mask — Happy in vanilla situations, but can also integrate with Vue 2/3. GitHub repo.

Alexander Shabunevich

node-calls-python: Call Python from Node — One use case the author mentions is plugging into Python’s rich ecosystem of machine learning tools.

Menyhért Hegedűs

reduced.to: Open Source URL Shortening App Built with Qwik — The app itself is live at reduced.to but you might find it interesting as an example of a frontend built using the Qwik framework.

Ori Granot

📺 Yesterday, This Dot Media published Qwik’s creator Misko Hevery giving ▶️ a live coding introduction to Qwik – a useful way to get up to speed.

💻 Jobs

Software EngineerStimulus is a social platform started by Sticker Mule to show what’s possible if your mission is to increase human happiness. Join our engineering team.

Stimulus

Senior UI Dev — Join us and innovate with MicroFrontends, custom Node tools, build systems (Webpack/Github Actions), TypeScript, React, and more with a11y and DX in mind.

Vertex Inc

Find JavaScript Jobs with Hired — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It’s free for job-seekers.

Hired

Spacetime 7.3
↳ Lightweight JavaScript timezone library.

Partytown 0.7.3
↳ Run intensive third-party scripts in a worker.

Splitter 1.4
↳ React component for split views.

reveal-md 5.4
↳ Reveal.js presentations from Markdown files.

Mongoose 6.8
↳ MongoDB object modeling library.

React Tooltip 5.0