← Week 7 — 8 / 16 →

One-Way Binding & Declarative UI

Under the hood, React is doing something like:

  const renderPage = (props) => {
    document.queryElement("title").innerText = props.title;
    let container = document.createElement("div");
    container.classList.add("container")
    if(props.activePage == "login") {
      let container = document.createElement("div");
      container.classList.add("login");
      let loginPanel = document.createElement("div");
      ...
    }
    else if(props.activePage == "splash") {
      ...
    }
  }

Just heavily optimized to only re-render the parts of the page that need to be updated.