Gooey

Gooey is a focused web framework designed to be straightforward, fast, and flexible.

It's a new frontend framework (like React, Vue, or SolidJS) that is designed to be straightforward, efficient, and flexible. Gooey was inspired by build systems (specifically tup), the minimal backbone framework, and spreadsheets.

It's released under the BSD-3-Clause license.

What's it look like?

Here's a simple "to-do" application:

An idiomatic implementation of the 7 GUIs can be viewed in the source code.

Where's the documentation?

Check the website, which contains both an overview and API documentation.

Where's the code?

The git repo can be found at github: https://github.com/sufianrhazi/gooey

If you'd like to contribute, please contact me directly via email.

Should I be using this?

It's new and hasn't been used for anything serious, so probably not. That being said, if you want to try something new and help with the effort, please do!

Why does this exist?

The world is flush with too many JavaScript UI frameworks. Against better judgement, I decided yet another one was worth building.

Gooey was made mostly as a thought experiment: can a UI framework be like a build system, which can intelligently determine the sequence of operations to take to update UI?

I've been working professionally with React for several years. It's a fantastic tool that raised the bar with respect to how frontend development is done, but the best praise is honest critique, and Gooey was designed almost in opposition to React.

In short, it has a few things that make it stand out:

  • It embraces mutation: model objects have properties that are reassigned and collection arrays have items added/removed
  • It's is a build system / spreadsheet / smart: dynamic UI is comprised of calculations, which are automatically recalculated when its data dependencies (including other calculations) change.
  • It keeps track of the global dependency graph using a (potentially novel) fully dynamic directed graph topological sorting and strongly connected components algorithm, which works in the presence of cycles: calculations are recalculated only when needed, in the correct order, and automatically memoized.
  • It uses a novel approach to DOM projection, allowing for fine-grained updates without virtual DOM diffing and without a "key" prop to keep track of items within arrays.
  • It allows for detaching rendered UI from the DOM and reattaching that UI (potentially to a different location) in the DOM.
  • It does not distinguish between "local" component state and "global" application state.

Please read introducing Gooey for a better overview of why this exists, and what makes it interesting.