JavaScriptExpert
diff --git a/‎client/head-manager.js
Lines changed: 13 additions & 0 deletions b/‎client/head-manager.js
Lines changed: 13 additions & 0 deletions
diff --git a/‎lib/head.js
Lines changed: 0 additions & 4 deletions b/‎lib/head.js
Lines changed: 0 additions & 4 deletions
diff --git a/‎lib/side-effect.js
Lines changed: 2 additions & 20 deletions b/‎lib/side-effect.js
Lines changed: 2 additions & 20 deletions
@@ -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] || []
 
@@ -9,10 +9,6 @@ class Head extends React.Component {
   render () {
     return null
   }
-
-  componentWillUnmount () {
-    this.context.headManager.updateHead([])
-  }
 }
 
 function reduceComponents (components) {
 
@@ -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)
       }
Original file line number	Diff line number	Diff line change
`@@ -9,10 +9,6 @@ class Head extends React.Component {`
`9`	`9`	`render () {`
`10`	`10`	`return null`
`11`	`11`	`}`
`12`		`-`
`13`		`- componentWillUnmount () {`
`14`		`- this.context.headManager.updateHead([])`
`15`		`- }`
`16`	`12`	`}`
`17`	`13`
`18`	`14`	`function reduceComponents (components) {`