google-chromeprofilingtimeline

Chrome timeline - how can I determine the cause of a "Recalculate Style" log entry?


Profiling a page with the built-in timeline recorder in Chrome, I see repeated "Recalculate Style" entries. They have no obvious information to link them to DOM element or event.

How can I best determine the cause of these entries?


Solution

  • My advice to you would be to use the Chrome Canary build of Chrome. Paul Irish has a good demo of using the Timeline in Chrome Dev Tools here

    You can simply click on the event, for instance 'Recalculate Style', and you should get a miniature stack trace pointing to where the event occurred in your code.