"No-Build Required" Reeact Framework
Ren Hiyama
Posted on August 31, 2022
Ever Considered why do need to download such a large node_modules
file for Next.js , RemixJS, and other frameworks? Just why do they need to download over 100mb to 200mb of data just to build a website and deploy it?
Well, You probably didn't. You have access to the latest PCs and servers, and you don't even need to wait to run your npm i
... Well again, its not your fault; you just don't simply care about it. But a lot of developers don't have access to these resources, and so they end up writing static HTML, or a barebones create-react-app without any good functionality. If you do think you are one of the developers who don't have a decent PC to start your web dev journey, you're at the right place my friend!
Meet Ree.js
What is it? Just a lightweight framework? Hell nah, it's packed with lot more goodies that you didn't imagine you could use so much less storage!
Reejs weighs less than 300kb, at the time of writing (and nearly 2mb if you use the default template, download their dependencies, and turn on Terser Minification!)
What's more?
Ever Heard of URL Imports? If you didn't, here's the long story short: No more NPM. Just straight away importing from a url.
A good example would be like this:
Instead of doing this the classic boring and bloated/slow way:
npm i react
And this in index.js
import react from "react"
You write:
import react from "https://esm.sh/react"
And to add more cherry on top, your same codebase which uses URL Imports, can be ran on browser, without BUILDING! Yes you heard it right!
Any more features?
While Reejs is still in its infancy, it's trying to accomplish every pros of Nextjs, RemixJS and other Frameworks, except removing their cons (ie. building and huge installation size)
As of now, Reejs ships with:
- Twind v1 as its primary CSS engine, with support for SSR CSS generation (beta support thanks to Sastan the maintainer of twind)
- Minifier for HTML, CSS, and JS (Thanks to Terser for being... uh... lightweight? 400kb and its quite good and fast so... you know π)
- URL Imports (we welcome PRs and Issues over https://github.com/rovelstars/reejs)
- REX Mode; An automated server engine that knows when to render CSR and SSR based on real life usage (still wip)
- No Builds I guess?
- ReeBlaze π₯ A fast yet powerful router to take the whole website CSR!
- A good CLI because you deserve it!
Please do note Reejs is in v0 (and v0.3.x to be more specific at the time of writing this) and so we are looking for issues for bug reports, and feature requests over our github repo.
Roadmap:
Please note this are not in order, and its mostly like to be added, but please bear in mind that there's no ETA and if they require building, we would discontinue that feature.
- Image Optimization
- Auto Head Updation
- Some Updates to ReeBlaze to allow more configs
- Reewrite Server to allow serverless deployment
- Not "vendor lock in" for nodejs environments, allow Deno and Bun to run Reejs
- Use a custom Reeact.js implementation that is more lightweight (1kb approx.)
- And a lot more!
- A good docs that's built on top of Reejs itself!
So what are you waiting for?
Consider Using Reejs in your future projects! Its stable enough by the way π
Also you can:
- Star Our Repo at https://github.com/rovelstars/reejs
- Join Our Discord Server at https://dscrdly.com/server
Posted on August 31, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.