| var list = []; | |
| document.querySelectorAll("body *") | |
| .forEach(function(elem){ | |
| if(elem.getBoundingClientRect().width > document.body.getBoundingClientRect().width){ | |
| list.push(elem.outerHTML.split('>')[0] + '>'); | |
| } | |
| }); | |
| confirm( "these elements are wider than the viewport:\n\n " + list.join("\n") ) |
| (function (context, trackingId, options) { | |
| const history = context.history; | |
| const doc = document; | |
| const nav = navigator || {}; | |
| const storage = localStorage; | |
| const encode = encodeURIComponent; | |
| const pushState = history.pushState; | |
| const typeException = 'exception'; | |
| const generateId = () => Math.random().toString(36); | |
| const getId = () => { |
All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.
Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.
elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent