function performWork(deadline) {
  if (!nextUnitOfWork) {
    // on initial render
    // or if all work is complete and the nextUnitOfWork is null
    //grab the first item on the workInProgress queue.
    initialUnitOfWork();
  }
  loopThroughWork(deadline)
  if (nextUnitOfWork || workQueue.length > 0) {
    // if theres more work to be done. get to know when the browser will be occupied
    // and check if we can perform some work with the timing provided.
    requestIdleCallback(performWork);
  }
}

function initialUnitOfWork() {
   //grab the first item in the array
   // its a first come first serve scenario.
   const update = workQueue.shift();

   // if there are no updates pending
  // abort since there is no work to do.
  if (!update) {
    return;
  }

  // this call will apply if the update came from setState
  // we need the object passed in this.setState to the
  // partialState of the current fiber
  if (update.partialState) {
    update.instance.__fiber.partialState = update.partialState;
  }

  const root =
    update.from === HOST_ROOT
      ? update.dom._rootContainerFiber
      : getRootNode(update.instance.__fiber);

  nextUnitOfWork = {
    tag: HOST_ROOT,
    stateNode: update.dom || root.stateNode, // the properties from the update are checked first for existence
    props: update.newProps || root.props, // if the update properties are missing default back to the root properties
    alternate: root
  };
}

function getRootNode(fiber) {
  // climb up the fiber until we reach to the fiber with no parent
  // This will give us the alternate property of each fiber if its not
  // the host_root, meaning the fiber at the very top of the tree
  let node = fiber;
  while (node.parent) {
    // as long as the current node has a parent keep climbing up
    // until node.parent is null.
    node = node.parent;
  }
  return node;
}