Add timing logs for browser rendering

author: Samy Pesse <samypesse@gmail.com> 2016-10-11 00:11:17 +0200
committer: Samy Pesse <samypesse@gmail.com> 2016-10-11 00:11:17 +0200
commit: fe0d4bf0243d717462cb373115467d2efad9b8e1 (patch)
tree: 51c8700a9c3e43379739be79781f6e7f98d45f2f
parent: aa39b8e71b980ff9100b5afa3d06679de0b2fadd (diff)
download: gitbook-fe0d4bf0243d717462cb373115467d2efad9b8e1.zip
gitbook-fe0d4bf0243d717462cb373115467d2efad9b8e1.tar.gz
gitbook-fe0d4bf0243d717462cb373115467d2efad9b8e1.tar.bz2
3 files changed, 79 insertions, 60 deletions
diff --git a/packages/gitbook/src/browser/loadPlugins.js b/packages/gitbook/src/browser/loadPlugins.js
index bd8a195..c9bf7a6 100644
--- a/packages/gitbook/src/browser/loadPlugins.js
+++ b/packages/gitbook/src/browser/loadPlugins.js
@@ -1,4 +1,5 @@
 const path = require('path');
+const timing = require('../utils/timing');
 
 /**
  * Load all browser plugins.
@@ -8,18 +9,23 @@ const path = require('path');
  * @return {Array}
  */
 function loadPlugins(plugins, type) {
-    return plugins
-        .valueSeq()
-        .filter(plugin => plugin.getPackage().has(type))
-        .map(plugin => {
-            const browserFile = path.resolve(
-                plugin.getPath(),
-                plugin.getPackage().get(type)
-            );
+    return timing.measure(
+        'browser.loadPlugins',
+        () => {
+            return plugins
+                .valueSeq()
+                .filter(plugin => plugin.getPackage().has(type))
+                .map(plugin => {
+                    const browserFile = path.resolve(
+                        plugin.getPath(),
+                        plugin.getPackage().get(type)
+                    );
 
-            return require(browserFile);
-        })
-        .toArray();
+                    return require(browserFile);
+                })
+                .toArray();
+        }
+    );
 }
 
 module.exports = loadPlugins;
diff --git a/packages/gitbook/src/browser/render.js b/packages/gitbook/src/browser/render.js
index 15e60ab..8fb4711 100644
--- a/packages/gitbook/src/browser/render.js
+++ b/packages/gitbook/src/browser/render.js
@@ -2,6 +2,7 @@ const React = require('react');
 const ReactDOMServer = require('react-dom/server');
 const GitBook = require('gitbook-core');
 
+const timing = require('../utils/timing');
 const loadPlugins = require('./loadPlugins');
 
 function HTML({head, innerHTML, payload, scripts, bootstrap}) {
@@ -54,44 +55,49 @@ function getBootstrapCode(role) {
  * @return {String} html
  */
 function render(plugins, initialState, type, role) {
-    // Load the plugins
-    const browserPlugins = loadPlugins(plugins, type);
-    const payload = JSON.stringify(initialState);
-    const context = GitBook.createContext(browserPlugins, initialState);
+    return timing.measure(
+        'browser.render',
+        () => {
+            // Load the plugins
+            const browserPlugins = loadPlugins(plugins, type);
+            const payload = JSON.stringify(initialState);
+            const context = GitBook.createContext(browserPlugins, initialState);
 
-    const currentFile = context.getState().file;
+            const currentFile = context.getState().file;
 
-    const scripts = plugins.toList()
-        .filter(plugin => plugin.getPackage().has(type))
-        .map(plugin => {
-            return currentFile.relative('gitbook/plugins/' + plugin.getName() + '.js');
-        })
-        .toArray();
+            const scripts = plugins.toList()
+                .filter(plugin => plugin.getPackage().has(type))
+                .map(plugin => {
+                    return currentFile.relative('gitbook/plugins/' + plugin.getName() + '.js');
+                })
+                .toArray();
 
-    const el = GitBook.renderWithContext(context, { role });
+            const el = GitBook.renderWithContext(context, { role });
 
-    // We're done with the context
-    context.deactivate();
+            // We're done with the context
+            context.deactivate();
 
-    // Render inner body
-    const innerHTML = ReactDOMServer.renderToString(el);
+            // Render inner body
+            const innerHTML = ReactDOMServer.renderToString(el);
 
-    // Get headers
-    const head = GitBook.Head.rewind();
+            // Get headers
+            const head = GitBook.Head.rewind();
 
-    // Render whole HTML page
-    const htmlEl = <HTML
-        head={head}
-        innerHTML={innerHTML}
-        payload={payload}
-        bootstrap={getBootstrapCode(role)}
-        scripts={[
-            currentFile.relative('gitbook/core.js')
-        ].concat(scripts)}
-    />;
+            // Render whole HTML page
+            const htmlEl = <HTML
+                head={head}
+                innerHTML={innerHTML}
+                payload={payload}
+                bootstrap={getBootstrapCode(role)}
+                scripts={[
+                    currentFile.relative('gitbook/core.js')
+                ].concat(scripts)}
+            />;
 
-    const html = ReactDOMServer.renderToStaticMarkup(htmlEl);
-    return html;
+            const html = ReactDOMServer.renderToStaticMarkup(htmlEl);
+            return html;
+        }
+    );
 }
 
 module.exports = render;
diff --git a/packages/gitbook/src/utils/timing.js b/packages/gitbook/src/utils/timing.js
index 1dce2a1..38ffd00 100644
--- a/packages/gitbook/src/utils/timing.js
+++ b/packages/gitbook/src/utils/timing.js
@@ -1,16 +1,17 @@
 const Immutable = require('immutable');
 const is = require('is');
+const Promise = require('./promise');
 
 const timers = {};
 const startDate = Date.now();
 
 /**
-    Mesure an operation
-
-    @parqm {String} type
-    @param {Promise} p
-    @return {Promise}
-*/
+ * Mesure an operation
+ *
+ * @param {String} type
+ * @param {Promise|Function} p
+ * @return {Promise|Mixed} result
+ */
 function measure(type, p) {
     timers[type] = timers[type] || {
         type,
@@ -22,8 +23,7 @@ function measure(type, p) {
 
     const start = Date.now();
 
-    return p
-    .fin(function() {
+    const after = () => {
         const end = Date.now();
         const duration = (end - start);
 
@@ -37,15 +37,24 @@ function measure(type, p) {
         }
 
         timers[type].max = Math.max(timers[type].max, duration);
-    });
+    };
+
+    if (Promise.isPromise(p)) {
+        return p.fin(after);
+    }
+
+    const result = p();
+    after();
+
+    return result;
 }
 
 /**
-    Return a milliseconds number as a second string
-
-    @param {Number} ms
-    @return {String}
-*/
+ * Return a milliseconds number as a second string
+ *
+ * @param {Number} ms
+ * @return {String}
+ */
 function time(ms) {
     if (ms < 1000) {
         return (ms.toFixed(0)) + 'ms';
@@ -55,10 +64,9 @@ function time(ms) {
 }
 
 /**
-    Dump all timers to a logger
-
-    @param {Logger} logger
-*/
+ * Dump all timers to a logger
+ * @param {Logger} logger
+ */
 function dump(logger) {
     const prefix = '    > ';
     let measured = 0;
@@ -77,7 +85,6 @@ function dump(logger) {
         .forEach(function(timer) {
             const percent = (timer.total * 100) / totalDuration;
 
-
             logger.debug.ln((percent.toFixed(1)) + '% of time spent in "' + timer.type + '" (' + timer.count + ' times) :');
             logger.debug.ln(prefix + 'Total: ' + time(timer.total) + ' | Average: ' + time(timer.total / timer.count));
             logger.debug.ln(prefix + 'Min: ' + time(timer.min) + ' | Max: ' + time(timer.max));
author	Samy Pesse <samypesse@gmail.com>	2016-10-11 00:11:17 +0200
committer	Samy Pesse <samypesse@gmail.com>	2016-10-11 00:11:17 +0200
commit	fe0d4bf0243d717462cb373115467d2efad9b8e1 (patch)
tree	51c8700a9c3e43379739be79781f6e7f98d45f2f
parent	aa39b8e71b980ff9100b5afa3d06679de0b2fadd (diff)
download	gitbook-fe0d4bf0243d717462cb373115467d2efad9b8e1.zip gitbook-fe0d4bf0243d717462cb373115467d2efad9b8e1.tar.gz gitbook-fe0d4bf0243d717462cb373115467d2efad9b8e1.tar.bz2