Javascript Tools

Collections

core-js
- Modular standard library for JavaScript.
- Includes polyfills for ECMAScript up to 2021:
  - promises, symbols, collections, iterators, typed arrays, many other features, ECMAScript proposals, some cross-platform WHATWG / W3C features and proposals like URL.
- You can load only required features or use it without global namespace pollution.
imaskjs - vanilla javascript input mask
Rome is a formatter, linter, bundler, and more for JavaScript, TypeScript, JSON, HTML, Markdown, and CSS.
- Rome is designed to replace Babel, ESLint, webpack, Prettier, Jest, and others.
Fasy - FP iterators that are both eager and asynchronous
spacetime A lightweight javascript timezone library
crypto-random-string - Generate a cryptographically strong random string
Publishing a Web Component to npm
State Machines for JavaScript Developers - How to Use Them in Your Apps
Nano ID: A tiny, secure, URL-friendly, unique string ID generator for JavaScript.
Sqids formerly Hashids is an open-source library that lets you generate YouTube-looking IDs from numbers.
Ninja Keys: Keyboard shortcuts interface for your website. Working with static HTML, Vanilla JS, Vue, React, Svelte.
ES module for detecting undefined CSS classes
Bree: is the best job scheduler for Node.js and JavaScript with cron, dates, ms, later, and human-friendly support.
execa: Process execution for humans
fast-deep-equal
CalDOM: An agnostic, reactive & minimalist (3kb) JavaScript UI library with direct access to native DOM.
HTM (Hyperscript Tagged Markup): JSX-like syntax in plain JavaScript - no transpiler necessary.
Hotkey Behavior: Trigger an action on an element with a keyboard shortcut.
Monorepo Dedendency Management Solutions - Solution analysis for Polaris Foundations
Jamstack ecosystem
Umbrella JS: ☔ Lightweight javascript library for DOM manipulation and events. A <3kb performant jQuery-like library born from the question: You might not need jQuery, then what do you need?
🚀 Axios Cache Interceptor
🤖 TanStack query Powerful asynchronous state management, server-state utilities and data fetching for TS/JS, React, Solid, Svelte and Vue.
🔛 🔖 sharer.js: Create your own social share buttons. No jquery.
What’s New In DevTools?
ow - Function argument validation for humans
Eruda - Console for mobile browsers
HLS.js is a JavaScript library that plays HLS in browsers with support for MSE.
Nano Stores - A tiny (258 bytes) state manager for React/RN/Preact/Vue/Svelte with many atomic tree-shakable stores
- https://docs.astro.build/en/core-concepts/sharing-state/#why-nano-stores
Happy DOM is a JavaScript implementation of a web browser without its graphical user interface. It includes many web standards from WHATWG DOM and HTML.
- The goal of Happy DOM is to emulate enough of a web browser to be useful for testing, scraping web sites and server-side rendering.
- Happy DOM focuses heavily on performance and can be used as an alternative to JSDOM.
- Read more about how to use Happy DOM
Slash libraries
- @toss/hangul
Type-safe React Query
sysend - Web application synchronization between different tabs
deadfile - Simple util to find deadcode and unused files in any JavaScript project (ES5, ES6, React, Vue, ...).
Using Notion as a Headless CMS with Nuxt
jose - "JSON Web Almost Everything" - JWA, JWS, JWE, JWT, JWK, JWKS for Node.js, Browser, Cloudflare Workers, Deno, Bun, and other Web-interoperable runtimes.
js-beautify - partly deobfuscate scripts
devalue - Gets the job done when JSON.stringify can't
vite-plugin-federation - Module Federation for vite & rollup
Croner - Cron for JavaScript and TypeScript
file-type is detected by checking the magic number of the buffer.
DevTools Tips - A collection of useful cross-browser DevTools tips
Aimless.js - The missing JavaScript randomness library.
ThumbHash - A very compact representation of an image placeholder
- unpic/placeholder🖼️ is a library for generating low quality image placeholders (LQIP) by extracting the dominant color from image, or by server-side rendering a BlurHash value.
🏃‍♂️🏃‍♀️🏃 JS minification benchmarks
Reflect - High-performance sync for multiplayer web apps
- Ready Player Two - Transactional Conflict Resolution instead of CRDTs
PartyKit simplifies developing multiplayer applications
rrweb - record and replay the web
Fraction.js - ℚ in JavaScript
BETTER-AUTH - The most comprehensive authentication framework for TypeScript

Framework

Svelte 5: Runes

reactivity and two way data binding creating a spaghetti mess of changes affecting other changes all over the place unless you're really careful is why React was made in the first place

Svelte uses signals as an implementation detail, but in a way that prevents the sorts of headaches you're describing.
- MrJohz's opinion among front-end frameworks
  
  Svelte is cool, but it has the key flaw that the more Svelte you write, the more compiled code appears - generally, Svelte compiles to a size somewhat larger than the original source file.
  
  For Svelte as an "island" tool (i.e. for building islands of interactivity in otherwise static pages, like, say, graphs for the New York Times), that's not a problem, because the extra generated code is made up for by the lack of a bulky runtime dependency. But if you scale that up to complicated SPAs - which has been Vue's main stomping ground - you can end up shipping larger files with Svelte than with other small frameworks.
  
  That said, SFCs in Vue are an ideal source for compile-time compilation, and my understanding is that they're heading more down the route of SolidJS. SolidJS has a similar goal of using a compile step for optimisation, but it leans on its signals library implementation much more heavily, which means the compiled code tends to be much smaller, but you also need to include a runtime. (In practice, there's not much size difference between Svelte and SolidJS at all, but it shows itself at the more extreme ends of very small components and very large apps.)
  
  Vue already has a runtime that's very similar in some ways to Solid's (read: it's all signals, baby), so adopting the rendering ideas from there is an obvious next step. That should drastically speed up rendering, as well as reducing bundle sizes significantly. They've already demoed this a bit, but I think it's not fully released yet - they gave a name for the new system, but I've forgotten what it's called.

Unpoly is the best thing I've discovered in the frontend world in the last 5 years. It's a breath of fresh air when compared to all the crazyness going on. I use it to replace almost all "api" calls to the backend and for the "turbolinks like" navigation, modals, etc. Then I use Alpinejs for the really interactive/complex parts.

I'm not doing a React/SPA ever again if I have any chance to decide on that.
https://news.ycombinator.com/item?id=33141055

TAURI: Build smaller, faster, and more secure desktop applications with a web frontend using WebView
neo.mjs - Web Worker enhanced frontend framework.
The Plasmo Framework is a battery-packed browser extension SDK made by hackers for hackers.
Comparing Astro and Next for React apps
- Next.js is best used for highly dynamic and image-heavy websites like dashboards because of its built-in image optimization. In contrast,
- Astro is best used for static websites like a portfolio or a personal blog.
Mitosis - Write components once, run everywhere. Compiles to Vue, React, Solid, Angular, Svelte, and more.