Throughout 2024, we’ve come across a variety of remarkable tools for designers and developers.

Our first roundup, titled “What’s New for Designers & Developers from 2024,” highlights the standout JavaScript tools and resources that either debuted or saw significant updates. These include zero-dependency JavaScript libraries, React frameworks, lightweight JavaScript libraries, data visualisation libraries, release of jQuery 4.0.0 and module registry for TypeScript and ESM.

As we look forward to the innovations 2025 will bring, let’s take a moment to reflect on the most noteworthy JavaScript tools, plugins, and resources from the past year. Enjoy the exploration!

January

Hana.js

Hana.js

Hana stands out as a straightforward, lightweight, and user-friendly React framework. Prioritizing developer experience, stability, and performance, Hana distinguishes itself from numerous other React frameworks by offering an abundance of features right out of the box, including built-in routing and state management.

Effection v3.0

Effection

Effection brings Structured Concurrency and Effects to JavaScript, seamlessly merging the ease of synchronous programming with handling side effects and asynchronous code. Developers can harness their existing knowledge of JavaScript while incorporating a few powerful concepts for more effective and intuitive code.

tsdocs.dev

Tsdocs

tsdocs.dev simplifies the process of swiftly browsing type documentation for popular JavaScript libraries. It provides an up-to-date reference for any past version of a library without the need for installation or searching for type declaration files.

February

Heat.js

Heat Js

Heatmap.js is a lightweight JavaScript library that generates customisable heat maps, offering a visual representation of date-based activity and trends. This tool is designed to provide a flexible and user-friendly way to visualise patterns and intensities of activities over time.

Plotteus

Plotteus

Plotteus is an open-source JavaScript data visualisation library designed for better storytelling. It’s a powerful tool that allows you to create interactive visualisations for your story from scratch, starting with defining a chart type, through seamless transitions between states, to giving you full control over them.

remoteStorage

Remotestorage

remoteStorage is a simple library that combines the localStorage API with a remote server to persist data across sessions. It works as a simple key value database store and backend with support for React, Next.js, Vue, Node, and any JavaScript stack.

March

jQuery 4.0.0 Beta

Jquery 4.0.0 Beta

Discover the features and changes coming with the upcoming release of jQuery 4.0.0 beta.  Including dropping support for older browsers, removing deprecated APIs, and transitioning the source to ES modules.

Tempo

Tempo

Tempo is a new library in a proud tradition of JavaScript date and time libraries. Inspired by the likes of moment.js, day.js, and date-fns, Tempo is built from the ground up to be as small and easy to use as possible — including first-class support for timezone operations.

h3

H3

h3 is a lightweight and composable server framework for JavaScript, meticulously designed to seamlessly operate with diverse JavaScript runtimes via adapters.

Ordena.js

Ordena.js

Ordena.js, a groundbreaking library that redefines the way we handle nested lists using pure vanilla JavaScript.

April

Alpine AJAX

Alpine Ajax

Alpine AJAX is a plugin for Alpine.js, empowering your HTML elements to request content from your server remotely. Utilise it to craft straightforward, resilient, and engaging websites with ease.

date-fns

Date Fns

date-fns offers the most comprehensive, yet simple and consistent toolkit for manipulating JavaScript dates across both browser and Node.js environments.

Rolldown

Rolldown

Rolldown is a JavaScript bundler written in Rust intended to serve as the future bundler used in Vite. It provides Rollup-compatible APIs and plugin interface, but will be more similar to esbuild in scope.

May

Faces.js

Faces Js

faces.js is a JavaScript library that creates and showcases cartoon faces, akin to the random Miis generated by Nintendo Wii. These faces are crafted as scalable vector graphics (SVG). Additionally, each face can be encapsulated within a compact JavaScript object, enabling you to store and reproduce the same face at a later time.

QuillJS V2.0.0

Quill Js

Quill is a versatile, free, and open-source WYSIWYG editor designed specifically for the modern web. Featuring a modular architecture and a flexible API, it offers complete customization to suit any requirement or preference.

consent-banner-js

consent banner js

A zero-dependency, lightweight (~3kB), consent platform agnostic, cookie banner for any website.

Puck

Puck React

Puck provides developers with the tools to create exceptional visual editing experiences within their React applications. It fuels the development of the next wave of content tools, no-code builders, and WYSIWYG editors, unlocking new possibilities for user interaction and creativity.

JSR

Jsr

The JavaScript Registry (JSR) is a module registry for TypeScript and ESM. Works with Node, Deno, browsers, and more. Free and open source.

June

SonnetJS

Sonnet Js

SonnetJS is a front-end framework designed for building modern web applications. It’s a collection of packages and tools that facilitate the development of web applications with ease.

Ice Cream JS

Ice Cream Js

Ice Cream is a JavaScript library for rendering HTML easily.

Zova

Zova

A Vue3 framework with an Inversion of Control (IoC) container. With the support of the IoC container, defining reactive states no longer requires ref/reactive, nor ref.value.

WyW-in-JS

Wyw In Js

wyw-in-js, short for “Whatever-you-want-in-JS,” is the world’s first toolkit for creating diverse zero-runtime CSS (and more) in JS libraries. It enables developers to build custom solutions with arbitrary syntax and functionality, providing complete independence from specific implementations.

July

Parvus

Parvus

An open-source, dependency-free image lightbox designed with accessibility in mind.

Radi.js

Radi Js

Radi is a tiny JavaScript framework, only 3kB when minified and gzipped. It’s built uniquely without employing a diffing algorithm or virtual DOM, which contributes to its exceptional speed.

Kaplay

Kaplay Js

Kaplay is the spiritual successor and fork of Kaboom, a JavaScript library designed to help you create games quickly and enjoyably!

August

VFX-JS

Vfx Js

VFX-JS is a JavaScript library designed to add WebGL-powered effects to your website. You can easily attach it to standard <img>, <video>, and other elements.

Swapy

Swapy

Swapy is a framework-agnostic tool that transforms any layout into a drag-and-swap interface with just a few lines of code.

MiniSearch

Minisearch

MiniSearch is a compact yet powerful in-memory full-text search engine written in JavaScript. It is resource-efficient and can seamlessly run both in Node.js and in the browser.

September

Radashi

Radashi

Radashi (pronounced /ruh-DAH-shee/) is a TypeScript utility toolkit offering a collection of lightweight functions that prioritize readability, performance, and robustness, making it an essential tool for developers.

PlaceholderJS

Placeholder Js

Ridiculously simple and lightweight placeholders, under 3KB compressed. Easily add image placeholders to your React development project or use their CDN.

NovaJS

Nova Js

A collection of dependency-free React hooks, carefully developed for easy integration into your projects—simply copy and paste them into your code.

October

The Boring JavaScript Stack

The Boring Javascript Stack

Ship your products using proven, battle-tested technologies. Avoid the distraction of chasing fleeting JavaScript trends, and focus on what truly matters—delivering to real users. No API is required for your single-page application (SPA).

HumanifyJS

Humanify

This tool leverages large language models (like ChatGPT and Llama) alongside other tools to deobfuscate, unminify, transpile, decompile, and unpack JavaScript code. While LLMs provide helpful hints for renaming variables and functions, they don’t make structural changes. The heavy lifting is handled by Babel at the AST level, ensuring the code remains 1:1 equivalent.

TinyJS

Tinyjs

TinyJS is a lightweight JavaScript library that simplifies dynamic creation of HTML elements with deep property assignment. It streamlines DOM manipulation by enabling you to programmatically generate any standard HTML tag, assign properties, append content, and easily select DOM elements.

November

CSSFun

Cssfun

Write modular CSS directly within your JavaScript code, complete with built-in themes and server-side rendering (SSR) support.

Olova

Olova

OlovaJS is a lightweight and minimalistic JavaScript framework designed to simplify the management and integration of dynamic behavior in your web projects.

December

mizu.js

Mizu

Looking to build interactive web apps with unmatched flexibility? Mizu.js provides around 30 powerful directives for dynamically rendering HTML, managing content, performing HTTP requests, creating custom elements, and much more. It’s your toolkit for adaptable and dynamic web development!

Viselect

Viselect

Viselect is a high-performance, lightweight library that provides a visual method for selecting elements, similar to the selection tool on your desktop. It’s incredibly compact, requires zero dependencies, and offers seamless integration with major frameworks.

Byteform

Byteform

Byteform is a lightweight and flexible TypeScript library for encoding and decoding binary data. With its intuitive API, it simplifies working with binary structures, making it an ideal solution for developers handling low-level data operations in both browser and Node.js environments.

Share

What’s New for Designers & Developers from 2024 – JavaScript Code & Tools