Greg Babiars gbabiars

## what-forces-layout.md

      
              1 file
            
          
              810 forks
            
          
              106 comments
            
          
              8083 stars
            
          
                paulirish
                / what-forces-layout.md
            
            
              Last active
              April 30, 2024 17:56
            
              
                What forces layout/reflow. The comprehensive list.
              
          
    What forces layout / reflow

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.
Element APIs

Getting box metrics


elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent


## PinchZoomPan.js
import React from 'react';

const MIN_SCALE = 1;
const MAX_SCALE = 4;
const SETTLE_RANGE = 0.001;
const ADDITIONAL_LIMIT = 0.2;
const DOUBLE_TAP_THRESHOLD = 300;
const ANIMATION_SPEED = 0.04;
const RESET_ANIMATION_SPEED = 0.08;
const INITIAL_X = 0;

## gh-pages-deploy.md

      
              1 file
            
          
              327 forks
            
          
              116 comments
            
          
              2166 stars
            
          
                cobyism
                / gh-pages-deploy.md
            
            
              Last active
              April 18, 2024 13:44
            
              
                Deploy to `gh-pages` from a `dist` folder on the master branch. Useful for use with [yeoman](http://yeoman.io).
              
          
    Deploying a subfolder to GitHub Pages

Sometimes you want to have a subdirectory on the master branch be the root directory of a repository’s gh-pages branch. This is useful for things like sites developed with Yeoman, or if you have a Jekyll site contained in the master branch alongside the rest of your code.
For the sake of this example, let’s pretend the subfolder containing your site is named dist.
Step 1

Remove the dist directory from the project’s .gitignore file (it’s ignored by default by Yeoman).

  
## happy_git_on_osx.md

      
              1 file
            
          
              184 forks
            
          
              57 comments
            
          
              930 stars
            
          
                trey
                / happy_git_on_osx.md
            
            
              Last active
              February 18, 2024 10:46
            
              
                Creating a Happy Git Environment on OS X
              
          
    Creating a Happy Git Environment on OS X

Step 1: Install Git
brew install git bash-completion

Configure things:
git config --global user.name "Your Name"

git config --global user.email "you@example.com"

  
## disable mcafee endpoint protection.md

      
              1 file
            
          
              40 forks
            
          
              27 comments
            
          
              230 stars
            
          
                tegansnyder
                / disable mcafee endpoint protection.md
            
            
              Last active
              December 26, 2023 03:18
            
              
                Disable McAffee Endpoint Protection OSX
              
          
    method 1

sudo /usr/local/McAfee/AntiMalware/VSControl stopoas
alternatively

sudo defaults write /Library/Preferences/com.mcafee.ssm.antimalware.plist OAS_Enable -bool False
sudo /usr/local/McAfee/AntiMalware/VSControl stop
sudo /usr/local/McAfee/AntiMalware/VSControl reload

  
## fetch.js
(function() {
  function status(response) {
    if (response.ok) {
      return response
    } else {
      var error = new Error(response.statusText || response.status)
      error.response = response
      throw error
    }
  }

## index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport"
        content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
  <title>Pinch Zoom</title>
</head>

<body>

## ReduxMicroBoilerplate.js
import React, { Component } from 'react';
import { createStore, combineReducers, applyMiddleware, bindActionCreators } from 'redux';
import { provide, connect } from 'react-redux';
import thunk from 'redux-thunk';

const AVAILABLE_SUBREDDITS = ['apple', 'pics'];

// ------------
// reducers
// ------------

## gist:3981133

      
              1 file
            
          
              10 forks
            
          
              37 comments
            
          
              85 stars
            
          
                tomdale
                / gist:3981133
            
            
              Last active
              November 26, 2019 21:19
            
              
                Ember.js Router API v2
              
          
    WARNING
This gist is outdated! For the most up-to-date information, please see http://emberjs.com/guides/routing/!
It All Starts With Templates

An Ember application starts with its main template. Put your header, footer, and any other decorative content in application.handlebars.
<header>


## LazilyLoad.js
import React from 'react';

const toPromise = (load) => (new Promise((resolve) => (
  load(resolve)
)));

class LazilyLoad extends React.Component {

  constructor() {
    super(...arguments);
	import React from 'react';

	const MIN_SCALE = 1;
	const MAX_SCALE = 4;
	const SETTLE_RANGE = 0.001;
	const ADDITIONAL_LIMIT = 0.2;
	const DOUBLE_TAP_THRESHOLD = 300;
	const ANIMATION_SPEED = 0.04;
	const RESET_ANIMATION_SPEED = 0.08;
	const INITIAL_X = 0;
	(function() {
	function status(response) {
	if (response.ok) {
	return response
	} else {
	var error = new Error(response.statusText \|\| response.status)
	error.response = response
	throw error
	}
	}
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport"
	content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
	<title>Pinch Zoom</title>
	</head>

	<body>
	import React, { Component } from 'react';
	import { createStore, combineReducers, applyMiddleware, bindActionCreators } from 'redux';
	import { provide, connect } from 'react-redux';
	import thunk from 'redux-thunk';

	const AVAILABLE_SUBREDDITS = ['apple', 'pics'];

	// ------------
	// reducers
	// ------------
	import React from 'react';

	const toPromise = (load) => (new Promise((resolve) => (
	load(resolve)
	)));

	class LazilyLoad extends React.Component {

	constructor() {
	super(...arguments);