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
| import React from 'react' | |
| const provideContext = (contextKey, contextType) => ( | |
| React.createClass({ | |
| childContextTypes: { | |
| [contextKey]: contextType | |
| }, | |
| getChildContext() { | |
| const { children, ...props } = this.props |
FWIW: I (@rondy) am not the creator of the content shared here, which is an excerpt from Edmond Lau's book. I simply copied and pasted it from another location and saved it as a personal note, before it gained popularity on news.ycombinator.com. Unfortunately, I cannot recall the exact origin of the original source, nor was I able to find the author's name, so I am can't provide the appropriate credits.
| -- Query the database to calculate a recommended innodb_buffer_pool_size | |
| -- and get the currently configured value | |
| -- The rollup as the bottom row gives the total for all DBs on the server, where each other row is recommendations per DB. | |
| SELECT | |
| TABLE_SCHEMA, | |
| CONCAT(CEILING(RIBPS/POWER(1024,pw)),SUBSTR(' KMGT',pw+1,1)) | |
| Recommended_InnoDB_Buffer_Pool_Size, | |
| ( | |
| SELECT CONCAT(CEILING(variable_value/POWER(1024,FLOOR(LOG(variable_value)/LOG(1024)))),SUBSTR(' KMGT',FLOOR(LOG(variable_value)/LOG(1024))+1,1)) |
| # use ImageMagick convert | |
| # the order is important. the density argument applies to input.pdf and resize and rotate to output.pdf | |
| convert -density 90 input.pdf -rotate 0.5 -attenuate 0.2 +noise Multiplicative -colorspace Gray output.pdf |