Lit 2.0: Meet Lit, all over again!

New name, new site, new version: smaller, better, faster, and SSR-ready.

Photo of Gray Norton
Gray Norton

Today, we’re excited to announce the first release candidate of Lit 2.0!

As we shared last summer, we have been hard at work on our first major update since shipping production-ready versions of lit-html and LitElement in early 2019. We’re calling this update Lit 2.0.

The API has been stable for a few months, and we’ve gotten great feedback from prerelease users, so late last night we cut our first release candidate. All that stands between us and an official release is a bit more time for developers to put the software through its paces and identify any final issues.

What’s in the new version?

Our major goals for Lit 2.0 were to reduce size, add powerful new features, improve performance and make some key changes under the hood to facilitate server-side rendering (SSR) — all while minimizing breaking changes. Easy, right?

Happily, we might have actually done it! To paraphrase a popular dance track from the early days of the Web, Lit 2.0 is:

  • Smaller. Lit 2.0’s templating system weighs in at 2.8k (minified and compressed), 10% smaller than the previous version, and its complete component base class (including templating) is just 5.2k, 20% smaller than before.

  • Better. Meanwhile, we’ve added a raft of new features, including several templating enhancements; a clean, new, class-based API for directive authors; and reactive controllers, a powerful new primitive for sharing stateful logic between components.

  • Faster. Efficient rendering has always been one of our core values, and Lit 2.0 is speedier than ever before: up to 20% faster on initial render, and up to 15% faster on updates.

  • Server. Lit 2.0 includes the foundation for fast, streaming SSR and flexible client-side hydration, unlocking a full range of use cases — from integration with popular frameworks (e.g., Next.js) and static site generators (e.g., eleventy) to apps built entirely with Lit and other web components.

And all of these improvements come with minimal changes to the existing API: the vast majority of existing Lit code will run with little to no modification. If you’re updating from a previous version, check out our helpful upgrade guide.

What else is new?

As we hinted above, the big news doesn’t end with the Lit 2.0 update — we’ve also made some major improvements beyond the software itself.

Most importantly, we’ve simplified our packaging, docs and presence. Whereas lit-html and LitElement have historically been separate packages with separate sites and docs, we’ve now combined them into a single product with a clear, simple identity — Lit — and a distinctive new logo.

Users have casually referred to our offerings as “Lit” for some time. By formalizing this name and simplifying the way we deliver the software, we aim to make Lit even easier to understand and use.

So, what does this mean in practice?

  • A new npm package: Installing Lit is now as simple as typing npm i lit. Since this is really our second major release, we chose to release the initial version of the new package as 2.0.

  • A new website: lit.dev is a brand new, one-stop shop for all things Lit, with a complete set of unified docs, a no-install interactive tutorial, a playground for exploring and creating sample code, and a dedicated Lit blog.

  • A new home on GitHub: We’ve moved our source code and issue tracker to the new Lit org on GitHub. Most of the code lives in the new lit mono-repo, which simplifies testing and releasing and makes the project more approachable for external contributors.

  • A new Twitter handle: We’ll be tweeting about Lit from @buildWithLit — follow this account to stay on top of all the latest news.

Simple. Fast. Web Components.

There’s actually a whole lot more to share, so we encourage you to explore lit.dev, watch today’s launch event (live or after the fact), and keep your eye on Twitter and the blog for more details in the coming weeks.

But despite all the news, Lit fundamentally remains what it has always been: a simple library for building fast, lightweight web components. Because it embraces the browser’s native component model, Lit is perfectly suited for building shareable components or design systems, and it can also help you build highly maintainable, future-ready sites and apps.

We can’t wait to see what you build with Lit 2.0!

Read more posts