Exploring Frontend Frameworks' Internals – Part 1: The basic structure of Frontend frameworks + Vue 3’s reactivity

• React

  1,687 221,535 9.8 JavaScript

  The library for web and native user interfaces.

  

Virtual DOM Renderer/Reconciler: This unit is in charge of invoking the render functions and managing the virtual DOM tree (e.g. "reacting" to state changes and updating the virtual DOM accordingly). React calls this component the reconciler (the source code is here), while Vue calls it the runtime renderer. It is called the reconciler because one of its main job is to perform Virtual DOM "diffing", or "reconciliation".

• react-native

  523 115,579 10.0 C++

  A framework for building native applications using React

  

React Reconciler's examples of building a custom renderer (React Native and React Three Fiber are two really great custom renderer examples).

• SurveyJS

  surveyjs.io sponsored

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

• core

  283 44,481 9.8 TypeScript

  🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web. (by vuejs)

  

Virtual DOM Renderer/Reconciler: This unit is in charge of invoking the render functions and managing the virtual DOM tree (e.g. "reacting" to state changes and updating the virtual DOM accordingly). React calls this component the reconciler (the source code is here), while Vue calls it the runtime renderer. It is called the reconciler because one of its main job is to perform Virtual DOM "diffing", or "reconciliation".

• react-three-fiber

  113 25,908 9.1 TypeScript

  🇨🇭 A React renderer for Three.js

  

React Reconciler's examples of building a custom renderer (React Native and React Three Fiber are two really great custom renderer examples).

• mobx-jsx

  4 254 0.0 TypeScript

  Raw MobX performance without being restrained by a Virtual DOM

mobx-jsx is using MobX as the reactivity system together with Solid's DOM renderer.

• MobX

  44 27,176 8.0 TypeScript

  Simple, scalable state management.

  

mobx-jsx is using MobX as the reactivity system together with Solid's DOM renderer.

• dom-expressions

  8 824 9.3 JavaScript

  A Fine-Grained Runtime for Performant DOM Rendering

vuerx-jsx is using Vue's reactivity system (@vue/reactivity) with Solid's DOM renderer. Both offer blazingly fast performance, (much) faster than their original usage.

• InfluxDB

  www.influxdata.com sponsored

  Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  

• vuerx-jsx

  2 79 0.0 TypeScript

  Vue Reactivity with Fine-Grained Rendering

vuerx-jsx is using Vue's reactivity system (@vue/reactivity) with Solid's DOM renderer. Both offer blazingly fast performance, (much) faster than their original usage.

Suggest a related project