makeRenderChecker.js

makeRenderChecker.js

function makeRenderChecker() {
  let oldProperties: any = {};

  return (name: string, newProperties: any) => {
    let rerender = false;
    let changedKeys: String[] = [];

    if (Object.keys(oldProperties).length === 0) {
      oldProperties = newProperties;
      console.log(name + " rendered");
      return;
    }

    for (const key in newProperties) {
      if (typeof oldProperties[key] === "undefined") {
        rerender = true;
        changedKeys.push(key);
        continue;
      }

      if (newProperties[key] !== oldProperties[key]) {
        rerender = true;
        changedKeys.push(key);
        continue;
      }
    }

    if (changedKeys.indexOf("item") !== -1 && typeof oldProperties["item"] !== "undefined") {
      console.log([oldProperties["item"], newProperties["item"]]);
    }

    oldProperties = newProperties;

    if (rerender) {
      console.log(name + " properties changed: " + changedKeys.join(","));
    } else {
      console.log(name + " rendered with same properties");
    }
  };
}