150+ open source Tailwind components.

Full-stack web development is (still) too complicated. Simple CRUD, a common requirement of any business application, should be simple to build, maintain, and extend when the need arises.

Remult is a full-stack CRUD framework that uses your TypeScript entities as a single source of truth for your API, frontend type-safe API client and backend ORM.

This isn’t just production-ready, it’s been used in production since 2018.

I love that people are bringing HTML back to the forefront:

Our mission is to enable anyone to build multi-page dynamic web apps while staying as close to the platform as possible. Enhance fills in the gaps to make building for the backend, and the browser a seamless experience for web authors and consumers.

Modern JavaScript frameworks bring more problems than they solve; recreating native web platform features adding unnecessary weight and complexity, which is challenging to unravel.

Enhance provides a dependable foundation built on standards-based web platform features, allowing developers to create web applications that are lightweight, flexible, and future-proof.

Tauri is an app framework built with Rust. You build UIs for it using virtually any frontend JavaScript framework. It has three major tenets: security, privacy, and environment. Speaking to the latter:

The apps you make are lean and performant, which reduces electricity, storage space, and general natural resource consumption. Every byte saved is a leaf on a tree that gets to grow.

This project has gotten a lot of early interest because, well, people have been waiting for an Electron alternative to emerge. Now that Tauri is 1.0 I’m guessing adoption will really start to take off.

Even more good news: we have an episode on Tauri in the hopper for ya 💪

Zach Leatherman breaks down what SSR means in various contexts (component frameworks, app frameworks. Here’s the gist, but the details are good to so def read Zach’s full post:

Application frameworks most often define SSR as the alternative to SSG (static site generation). A runtime server is used to render the components on request.

Component frameworks define SSR as generating static HTML from a component definition. They offer no preference as to whether this should or can happen at build time or at request-time.

Fresh is in the “SSR with client-side progressive enhancement” camp. I have to admit their list of ‘stand out’ features are quite appealing:

• No JS is shipped to the client by default
• No build step
• No configuration required
• TypeScript support out of the box

If you’re feeling some JavaScript and/or Framework Fatigue, this won’t help. But competition pushes everyone (Next, Remix, etc) to improve. So, whether you check Fresh out or not, hopefully it’ll have a positive impact on your work.

Josh Comeau writing for Smashing Mag:

Developers often reach for UI frameworks like Bootstrap or Material UI, hoping that they’ll save a bunch of time and quickly build a professional-looking app. Unfortunately, things rarely work out this way. Let’s talk about it.

Stick around for the rebuttals section, too.

The much-anticipated (and admittedly much-hyped) full stack web framework for React has opened its source (MIT license) to the public. What’s interesting about Remix? Here’s some marketing copy from the homepage:

Remix is a seamless server and browser runtime that provides snappy page loads and instant transitions by leveraging distributed systems and native browser features instead of clunky static builds. Built on the Web Fetch API (instead of Node) it can run anywhere. It already runs natively on Cloudflare Workers, and of course supports serverless and traditional Node.js environments, so you can come as you are.

Okay that is pretty sales-y (hit up the homepage for more like that), so you might prefer jumping straight over to the docs instead and check out the example Jokes app to see what’s what.

Encore now supports the two most highly requested features from our users!

• Native support for building REST APIs
• Support for ORMs and other database query helpers

Encore v0.17 also comes with improvements to authentication, and lots of minor improvements and bug fixes!

What Vercel has enabled teams to do with Next.js is next level, and it’s truly evident when you read stories like this one from Cory Etzkorn on Notion migrating their marketing site to Next.js.

We rebuilt our entire marketing site from scratch, choosing to go with a statically generated architecture over our former purely client-rendered approach. Two months and 109 React components later, we’ve now fully migrated to our framework of choice, Next.js, and couldn’t be happier with our decision. Here’s how we got there.

Ultra is a web framework that leans hard into your browser’s native features. Embrace the future of ES Modules, Import Maps, and Web Streams. All while supporting some of the non-standards that many normal people love for some reason (JSX and TypeScript).

axum focuses on ergonomics and modularity. It can:

• Route requests to handlers with a macro free API.
• Declaratively parse requests using extractors.
• Simple and predictable error handling model.
• Generate responses with minimal boilerplate.
• Take full advantage of the [tower] and [tower-http] ecosystem of middleware, services, and utilities.

Lots of axum doing various webby things right here.

Encore uses static analysis and code generation to reduce the boilerplate you have to write, resulting in an extremely productive developer experience.

The list of superpowers is impressive, to say the least. I know gophers tend to be skittish when they’re approached by a framework, though, so I’d love to hear more about this project on Go Time…

Adam Wathan reveals Tailwind’s new JIT compiler:

One of the hardest constraints we’ve had to deal with as we’ve improved Tailwind CSS over the years is the generated file size in development. With enough customizations to your config file, the generated CSS can reach 10mb or more, and there’s only so much CSS that build tools and even the browser itself will comfortably tolerate.

Today I’m super excited to share a new project we’ve been working on that makes this constraint a thing of the past: a just-in-time compiler for Tailwind CSS.

A solid breakdown of both the benefits and drawbacks of these two popular approaches to managing CSS. Stick around to the end where a 3rd, merged approach is presented.

Tom MacWright shared some concerns for SPAs place in the modern web and followed it up with a post sharing suggestions to use instead.

The SPA pattern (Single-Page Apps), I tried to define, was about the React model, which also covers, to a large extent, the model of Vue, Angular, and other frontend frameworks.

Like any critique, it begs for a prescription and I didn’t give one, other than gesturing toward server-side frameworks like Rails and Django. But I think there are some trends starting to form. I had queued up some time to really dive into the frameworks, but things like walking in parks have taken priority, so here’s just a grand tour.

Arwes is a web framework to build user interfaces for web applications based on science fiction and cyberpunk styles guidelines, animations and sounds effects. The idea is to provide an user experience as if you were using futuristic out of a movie interfaces for your project.

The sounds are perfect.

Hyperapp claims to be twice as fast as React, weighs in at 1.8KB, and renders interactively in ~10ms.

Hyperapp is a modern VDOM engine, state management solution, and application design pattern all-in-one. once you learn to use it, there’ll be no end to what you can do.

Filed under: zero-minutes-since-last-frontend-framework

Bonsai is a complete CSS solution allowing you to build beautifully crafted web interfaces with ease. Leave behind the bulky dependancies normally assiociated with utility first frameworks. Bonsai’s unique approach gives a complete toolset while providing a performant responsive solution.

Just 8KB gzipped.

Tobias Uhlig:

Neo is based on top of ES8 and uses the latest ES features as long as they can run directly inside the browser. This is one of the major design goals: the dev mode can run inside a browser without needing any JS related builds or transpilations. Instead of using any kind of templates, persistent JSON structures are in place. The combinations of these concepts lead to a pretty amazing performance and adds new possibilities for scaling to the UI area.

I haven’t seen any benchmarks or examples where using Neo produces extreme performance, but conceptually it makes sense that moving computationally expensive things to background threads would keep your UI thread snappy.

We all know our users pay a cost when we push our JS framework in to their browser. Now, thanks to Tim Kadlec doing the yeoman’s work of crunching the numbers, we can approximate just how much that cost really is.

There is no faster (pun intended) way to slow down a site than to use a bunch of JavaScript. The thing about JavaScript is you end up paying a performance tax no less than four times:

1. The cost of downloading the file on the network
2. The cost of parsing and compiling the uncompressed file once downloaded
3. The cost of executing the JavaScript
4. The memory cost

Thanks to HTTP Archive, we can figure that out.

I’m pretty happy with how sites using jQuery size up. Granted, it’s not really a UI framework like the others are, but you have to imagine that many of those sites also use jQuery UI and their overall cost still compares well to the more modern solutions.

Brandon Bayer:

The central thesis is that most apps don’t need a REST or GraphQL API. Blitz brings back the simplicity of server rendered frameworks like Ruby on Rails while preserving everything we love about React.

Additionally, Blitz is bringing other Rails goodness that’s missing in the React ecosystem like file structure and routing conventions, a really nice console REPL, intelligent code-scaffolding, and a fine-tuned out-of-the-box setup with Prettier, Typescript, ESlint, Jest, Cypress, etc.

The framework ‘wars’ continue right alongside the monolith-vs-microservices debate. For more on the principles behind Blitz, check out the manifesto.

Follow along with Christine Dodrill as she makes a small HTTP service using Rust and Rocket. This can also serve as a new Rust project primer too.

This is how I start a new Rust project. I put all of the code described in this post in this GitHub repo in case it helps. Have fun and be well.

I know the Go community isn’t one for frameworks, but as a long time framework user myself, I’ve never quite understood the resistance. Fiber doesn’t hide the ball. It comes right out and says “this is a web framework written in Go”. Here’s the philosophy behind that:

New gophers that make the switch from Node.js to Go are dealing with a learning curve before they can start building their web applications or microservices. Fiber, as a web framework, was created with the idea of minimalism and follow UNIX way, so that new gophers can quickly enter the world of Go with a warm and trusted welcome.

Fiber is inspired by Express, the most popular web framework on the Internet. We combined the ease of Express and raw performance of Go. If you have ever implemented a web application on Node.js (using Express or similar), then many methods and principles will seem very common to you.

Rete is a modular framework for visual programming. Rete allows you to create node-based editor directly in the browser. You can define nodes and workers that allow users to create instructions for processing data in your editor without a single line of code.