Feature

29 Dec 2023 . vue .

  1. Virtual DOM: a light-weight tree representation of the original HTML DOM and updated without affecting the original DOM.
    • Mechanism
      1. Whenever any underlying data changes, the entire UI is re-rendered in Virtual DOM representation.

      2. Then the difference between the previous DOM representation and the new one is calculated.

      3. Once the calculations are done, the real DOM will be updated with only the things that have actually changed.

    • Prevents unnecessary repaints.
    • Only repaints updated elements.
    • Groups together repaints.
  2. Components: create reusable custom elements.
  3. Templates: provide HTML based templates that bind the DOM with the Vue instance data.
  4. Routing: navigation between pages.
  5. Light weight

ES6 new features

  1. let and const
  2. Arrow functions allos a short syntax for writing function expressions
  3. Spread Operator
  4. Classes are templates for JavaScript Objects
  5. Promises
const myPromise = new Promise(function(myResolve, myReject) {
// "Producing Code" (May take some time)

  myResolve(); // when successful
  myReject();  // when error
});

// "Consuming Code" (Must wait for a fulfilled Promise).
myPromise.then(
  function(value) { /* code if successful */ },
  function(error) { /* code if some error */ }
);