Skip to content

Instantly share code, notes, and snippets.

View leocaseiro's full-sized avatar
💭
I',m probably studying...

Leo Caseiro leocaseiro

💭
I',m probably studying...
View GitHub Profile
@bathos
bathos / ng-material-color-classes.js
Last active March 17, 2016 05:32
md color classes (.text & .background w/ contrast text)
module.run(($mdColorPalette, $mdTheming) => {
const { THEMES } = $mdTheming;
const rules = [];
for (const themeName in THEMES) {
const { colors } = THEMES[themeName];
const themeCls = themeName == 'default' ? '' : `.md-${ themeName }-theme`;
@paulirish
paulirish / what-forces-layout.md
Last active August 21, 2025 20:11
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
@philstrong
philstrong / gist:83bd14a85f7bebf7fc01
Last active October 17, 2018 19:45 — forked from ivanoats/gist:1823034
Setting up GIT Bash autocompletion. Use this only if you are using Bash instead of ZSH.
@dh94
dh94 / mdStyleColor.js
Last active April 12, 2017 09:11 — forked from ThadeuLuz/mdStyleColor.js
Trying to add more flexibility to elements css in angular-material
(function () {
"use strict";
var _theme;
var _palettes;
angular
.module('mdColors',['mdColors'])
.config(['$mdThemingProvider', function($mdThemingProvider){
@ThadeuLuz
ThadeuLuz / mdStyleColor.js
Last active March 17, 2016 05:13
Trying to add more flexibility to elements css in angular-material
(function () {
"use strict";
var _theme;
angular
.module('mdColors',['mdColors'])
.config(['$mdThemingProvider', function($mdThemingProvider){
_theme = $mdThemingProvider.theme();
@glen-cheney
glen-cheney / encoding-video.md
Last active November 24, 2024 10:09
Encoding video for the web

Encoding Video

Installing

Install FFmpeg with homebrew. You'll need to install it with a couple flags for webm and the AAC audio codec.

brew install ffmpeg --with-libvpx --with-libvorbis --with-fdk-aac --with-opus
@jquense
jquense / 0. intro.md
Last active September 24, 2022 05:10
Alternative ways to define react Components

The 0.13.0 improvements to React Components are often framed as "es6 classes" but being able to use the new class syntax isn't really the big change. The main thing of note in 0.13 is that React Components are no longer special objects that need to be created using a specific method (createClass()). One of the benefits of this change is that you can use the es6 class syntax, but also tons of other patterns work as well!

Below are a few examples creating React components that all work as expected using a bunch of JS object creation patterns (https://github.com/getify/You-Dont-Know-JS/blob/master/this%20&%20object%20prototypes/ch4.md#mixins). All of the examples are of stateful components, and so need to delegate to React.Component for setState(), but if you have stateless components each patterns tends to get even simpler. The one major caveat with react components is that you need to assign props and context to the component instance otherwise the component will be static. The reason is

@paulirish
paulirish / bling.js
Last active July 23, 2025 07:08
bling dot js
/* bling.js */
window.$ = document.querySelector.bind(document);
window.$$ = document.querySelectorAll.bind(document);
Node.prototype.on = window.on = function(name, fn) { this.addEventListener(name, fn); };
NodeList.prototype.__proto__ = Array.prototype;
NodeList.prototype.on = function(name, fn) { this.forEach((elem) => elem.on(name, fn)); };
@ghinda
ghinda / object-to-form-data.js
Last active May 13, 2025 05:55
JavaScript Object to FormData, with support for nested objects, arrays and File objects. Includes Angular.js usage.
// takes a {} object and returns a FormData object
var objectToFormData = function(obj, form, namespace) {
var fd = form || new FormData();
var formKey;
for(var property in obj) {
if(obj.hasOwnProperty(property)) {
if(namespace) {
@colingourlay
colingourlay / example.js
Last active October 22, 2021 15:16
Lodash / Underscore sort object keys. Like _.sortBy(), but on keys instead of values, returning an object, not an array. Defaults to alphanumeric sort.
var obj = {b: 3, c: 2, a: 1};
_.sortKeysBy(obj);
// {a: 1, b: 3, c: 2}
_.sortKeysBy(obj, function (value, key) {
return value;
});
// {a: 1, c: 2, b: 3}