batch update head contents (#129)

* head-manager: batch update

* side-effect: remove redundant rendering cycle checks

client/head-manager.js

@@ -3,7 +3,20 @@ import HTMLDOMPropertyConfig from 'react/lib/HTMLDOMPropertyConfig'
 const DEFAULT_TITLE = ''
 
 export default class HeadManager {
+  constuctor () {
+    this.requestId = null
+  }
+
   updateHead (head) {
+    // perform batch update
+    window.cancelAnimationFrame(this.requestId)
+    this.requestId = window.requestAnimationFrame(() => {
+      this.requestId = null
+      this.doUpdateHead(head)
+    })
+  }
+
+  doUpdateHead (head) {
     const tags = {}
     head.forEach((h) => {
       const components = tags[h.type] || []

lib/head.js

@@ -9,10 +9,6 @@ class Head extends React.Component {
   render () {
     return null
   }
-
-  componentWillUnmount () {
-    this.context.headManager.updateHead([])
-  }
 }
 
 function reduceComponents (components) {

lib/side-effect.js

@@ -24,7 +24,6 @@ export default function withSideEffect (reduceComponentsToState, handleStateChan
 
     const mountedInstances = new Set()
     let state
-    let shouldEmitChange = false
 
     function emitChange (component) {
       state = reduceComponentsToState([...mountedInstances])
@@ -36,12 +35,6 @@ export default function withSideEffect (reduceComponentsToState, handleStateChan
       }
     }
 
-    function maybeEmitChange (component) {
-      if (!shouldEmitChange) return
-      shouldEmitChange = false
-      emitChange(component)
-    }
-
     class SideEffect extends Component {
       // Try to use displayName of wrapped component
       static displayName = `SideEffect(${getDisplayName(WrappedComponent)})`
@@ -60,8 +53,6 @@ export default function withSideEffect (reduceComponentsToState, handleStateChan
           throw new Error('You may only call rewind() on the server. Call peek() to read the current state.')
         }
 
-        maybeEmitChange()
-
         const recordedState = state
         state = undefined
         mountedInstances.clear()
@@ -70,24 +61,15 @@ export default function withSideEffect (reduceComponentsToState, handleStateChan
 
       componentWillMount () {
         mountedInstances.add(this)
-        shouldEmitChange = true
-      }
-
-      componentDidMount () {
-        maybeEmitChange(this)
-      }
-
-      componentWillUpdate () {
-        shouldEmitChange = true
+        emitChange(this)
       }
 
       componentDidUpdate () {
-        maybeEmitChange(this)
+        emitChange(this)
       }
 
       componentWillUnmount () {
         mountedInstances.delete(this)
-        shouldEmitChange = false
         emitChange(this)
       }