1. <html>

  2.   <head>

  3.     <title>React Hacker News Benchmark</title>

  4.     <link rel="stylesheet" type="text/css" href="style.css" />

  5.   </head>

  6.   <body>

  7.     <div id="app"></div>

  8.     <script>

  9.       performance.mark('Load React');

  10.       performance.mark('Load React+ReactDOM');

  11.     </script>

  12.     <script src="react.production.min.js"></script>

  13.     <script>

  14.       performance.measure('Load React', 'Load React');

  15.     </script>

  16.     <script>

  17.       performance.mark('Load ReactDOM');

  18.     </script>

  19.     <script src="react-dom.production.min.js"></script>

  20.     <script>

  21.       performance.measure('Load ReactDOM', 'Load ReactDOM');

  22.       performance.measure('Load React+ReactDOM', 'Load React+ReactDOM');

  23.     </script>

  24.     <script src="top-stories.js"></script>

  25.     <script src="benchmark.js"></script>

  26.     <script>

  27.       performance.mark('Initial Render');

  28.       render();

  29.       performance.measure('Initial Render', 'Initial Render');

  30.       requestAnimationFrame(() => {

  31.         performance.mark('Update Render');

  32.         render();

  33.         performance.measure('Update Render', 'Update Render');

  34.       });

  35.     </script>

  36.   </body>

  37. </html>
About Sign Up Leave Feedback Contact