This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.
To capture the video (filesize: 19MB), using the free "QuickTime Player" application:
| DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE | |
| Version 2, December 2004 | |
| Copyright (C) 2011 Jed Schmidt <http://jed.is> | |
| Everyone is permitted to copy and distribute verbatim or modified | |
| copies of this license document, and changing it is allowed as long | |
| as the name is changed. | |
| DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE |
| R = React.DOM | |
| nations = ['britain', 'ireland', 'norway', 'sweden', 'denmark', 'germany', | |
| 'holland', 'belgium', 'france', 'spain', 'portugal', 'italy', 'switzerland'] | |
| Typeahead = React.createClass | |
| getInitialState : -> {input: ""} | |
| handleChange : -> @setState input: @refs.field.getDOMNode().value | |
| handleClick : (nation)-> @setState input: nation | |
| matches : (input)-> |
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| const createLogger = (backgroundColor, color) => { | |
| const logger = (message, ...args) => { | |
| if (logger.enabled === false) { | |
| return; | |
| } | |
| console.groupCollapsed( | |
| `%c${message}`, | |
| `background-color: ${backgroundColor}; color: ${color}; padding: 2px 4px;`, | |
| ...args |
| export const chaosTestStrings = (): void => { | |
| const textNodes = getAllTextNodes(document.body); | |
| for (const node of textNodes) { | |
| const textNodeLength = node.textContent ? node.textContent.length : 0; | |
| if (node.textContent === null) { | |
| return; | |
| } | |
| if (node.parentElement instanceof Element) { | |
| if (node.parentElement.dataset.originalText === undefined) { |