title: How do I keep document.title updated in React app?
body: <p>Since React doesn't have any builtin way to manage <code>document.title</code>, I used to set it inside <code>componentDidMount</code> of my route handlers.</p>
  
  <p>However now I need to amend the title based on <code>state</code> fetched asynchronously. I started putting assingments into <code>componentDidUpdate</code>, but every now and then I forget to put <code>document.title</code> assignment into some pages, and previous title sticks around until I finally notice it.</p>
  
  <p>Ideally I'd like a way to express <code>document.title</code> declaratively, without having to assign it.   Some kind of “fake” component would probably be most convenient, given that I want to be able to specify the document title at several nesting levels:</p>
  
  <ul>
  <li>On top level (the default title);</li>
  <li>On page level (for some of the pages, but not all);</li>
  <li>Sometimes, on inner component level (e.g. user typing into a field).</li>
  </ul>
  
  <p>Additional requirements:</p>
  
  <ul>
  <li>Title specified in child should override title specified by parent;</li>
  <li>Reliable (guarantees cleanup on route change);</li>
  <li>Should not emit any DOM (i.e. no hacks with component returning <code>&lt;noscript&gt;</code>);</li>
  <li>I'm using react-router but it's better if this component works with other routers too.</li>
  </ul>
  
  <p>Anything I can use?</p>