My learning project became a JavaScript framework: Brio.js v5
On February 12, 2024, I committed a file with the message: A not so good scope architecture Five days later, the next commit said: New scoping system That's the most honest summary of how Brio.js was built. I wrote something, I learned why it was wrong, and I wrote it again. I did that a lot, for fun and to learn how the frameworks I used every day actually work. At some point the "learning…
In February 2024, the author began a learning project that would eventually become the JavaScript framework Brio.js v5. Initially, the project was plagued with a poor scope architecture, but after five days, the author introduced a new scoping system. This iterative process of writing, learning, and rewriting continued for an extended period.
The framework was quietly incorporated into a small production project, which led to the addition of tests, documentation, a playground, a starter CLI, and a website. After weeks of development, the author released Brio.js v5 to the public.
Brio.js adds reactivity to HTML using b-* attributes, working directly with the real DOM without virtual DOM, JSX, compilers, or runtime dependencies. A minimal Brio app can be created with a single script tag and one mount command, resulting in a button that increments a count.
The framework features a small creature with customizable mood, color, size, and name, providing an interactive demonstration. Brio.js emphasizes transparency by explicitly stating the source of every value in templates, making it easier to understand where data originates.
One of the framework's core principles is that it only owns what is mounted, allowing Brio to be integrated into existing pages without interfering with other elements. The framework also offers various starters, add-ons, and example applications, catering to different use cases and preferences.
Despite its growing feature set, Brio.js has some limitations, such as the need for a separate build for Strict CSP and its current support for modern evergreen browsers. The author views this stage as an ideal time to engage with the community and receive feedback on potential areas of confusion.
Written by urgent.news from Dev.to's reporting — not their text. Machine-written — may contain errors; check the original before relying on it.
