JavaScript

JavaScript

Autocomplete seems like one of the easiest features to build. You take the user's input, loop through your list of options, and filter anything that starts with the same prefix: const matches = words.filter(w => w.startsWith(prefix)); And that works for small lists of text. But once your dataset gets large, or your completions come from structured text (like user.address.city or $gte), simple loops start to fall short.

As CSS patterns go these days this one is delightfully low-tech, but in my work I've seen it have an outsized impact in ensuring usable experiences for increasingly-heavy websites when network or device conditions aren't ideal. This notion of delivering "optimistically" while planning for failure is something I've written about before, but the set-it-and-forget-it nature of this latest stab at it makes it my favorite yet.

XEditable Lite is a lightweight JavaScript library that adds modern inline and popup editing to your web application. It's a full, drop-in replacement for the classic Bootstrap x-editable library and works with or without Bootstrap & jQuery. The library keeps the same API, so you can modernize your projects without rewriting existing code. Features: Dual editing modes: Supports popup editing with viewport-aware positioning and inline editing with compact icon controls.

The JavaScript juggernaut never stops. There are a number of features introduced by the "living spec" every year. Then it takes some time for the browsers, Node.js, etc. to roll them in, and before you know it, there's a big pile of new JavaScript features you haven't tried. It's not too late. Here I've rounded up the ES11 (ECMAScript 11, aka ECMAScript 2020) features that you may have missed. They include a number of ergonomic and other modern improvements. Let's take a look.

Modern web development is all about efficiency. We have libraries, frameworks, packages, AI tools, and Hooks. We need to build and ship fast. When React Hooks came into the picture, it was revolutionary. It changed the React game forever. Now, we know and use built-in Hooks like useState or useEffect, but we also know that there are custom Hooks. React is flexible enough to let developers write and reuse their own Hooks, or share them so that other developers can benefit too.

Vite+, the new unified JavaScript toolchain built on top of Vite, has been announced by VoidZero. Positioned as a drop-in superset of Vite, Vite+ introduces an all-in-one CLI experience, covering project scaffolding, testing, linting, formatting, library bundling, monorepo task running, and devtools visualization. The ambition is to reduce toolchain fragmentation and align large teams around a single, high-performance workflow. Vite+ aims to deliver enhancements across three primary dimensions: tooling consolidation, performance & scale, and enterprise-grade features.