Vistavia 🚀

A personal hobby project to learn and understand how reactivity systems work in frontend frameworks, especially Vue.js.

What is this?

This is my playground for exploring the magic behind reactive programming! I'm building a simple reactivity system from scratch to understand how frameworks like Vue make data reactive and automatically update the UI when it changes.

Why?

Ever wondered how Vue's ref() and reactive() work under the hood? Or how the framework knows exactly when to re-render components? This project is my way of diving deep into those concepts and learning by doing.

What's inside?

Currently exploring:

• Effects - The core of reactivity that tracks dependencies and re-runs when data changes
• Dependency tracking - How the system knows which effects depend on which data
• Triggering updates - How changes in data automatically trigger re-computations

Getting started

# Install dependencies
pnpm install

# Start the dev server
pnpm dev

Learning journey

This is very much a work in progress! I'm documenting my learning process and experimenting with different approaches to understand reactivity patterns.

---

Built with curiosity and a lot of coffee ☕