useRenderTimes.js 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738
  1. /* istanbul ignore file */
  2. import * as React from 'react';
  3. function useRenderTimes(props, debug) {
  4. // Render times
  5. var timesRef = React.useRef(0);
  6. timesRef.current += 1;
  7. // Props changed
  8. var propsRef = React.useRef(props);
  9. var keys = [];
  10. Object.keys(props || {}).map(function (key) {
  11. var _propsRef$current;
  12. if ((props === null || props === void 0 ? void 0 : props[key]) !== ((_propsRef$current = propsRef.current) === null || _propsRef$current === void 0 ? void 0 : _propsRef$current[key])) {
  13. keys.push(key);
  14. }
  15. });
  16. propsRef.current = props;
  17. // Cache keys since React rerender may cause it lost
  18. var keysRef = React.useRef([]);
  19. if (keys.length) {
  20. keysRef.current = keys;
  21. }
  22. React.useDebugValue(timesRef.current);
  23. React.useDebugValue(keysRef.current.join(', '));
  24. if (debug) {
  25. console.log("".concat(debug, ":"), timesRef.current, keysRef.current);
  26. }
  27. return timesRef.current;
  28. }
  29. export default process.env.NODE_ENV !== 'production' ? useRenderTimes : function () {};
  30. export var RenderBlock = /*#__PURE__*/React.memo(function () {
  31. var times = useRenderTimes();
  32. return /*#__PURE__*/React.createElement("h1", null, "Render Times: ", times);
  33. });
  34. if (process.env.NODE_ENV !== 'production') {
  35. RenderBlock.displayName = 'RenderBlock';
  36. }