Skip to content

Instantly share code, notes, and snippets.

View danomanion's full-sized avatar

LaminarRainbow danomanion

View GitHub Profile
@PaulKinlan
PaulKinlan / criticalcss-bookmarklet-devtool-snippet.js
Last active April 2, 2024 02:45
CriticalCSS Bookmarklet and Devtool Snippet.js
(function() {
var CSSCriticalPath = function(w, d, opts) {
var opt = opts || {};
var css = {};
var pushCSS = function(r) {
if(!!css[r.selectorText] === false) css[r.selectorText] = {};
var styles = r.style.cssText.split(/;(?![A-Za-z0-9])/);
for(var i = 0; i < styles.length; i++) {
if(!!styles[i] === false) continue;
var pair = styles[i].split(": ");
@paulirish
paulirish / rAF.js
Last active March 22, 2024 00:00
requestAnimationFrame polyfill
// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating
// requestAnimationFrame polyfill by Erik Möller. fixes from Paul Irish and Tino Zijdel
// MIT license
(function() {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
@scottjehl
scottjehl / noncritcss.md
Last active August 12, 2023 16:57
Comparing two ways to load non-critical CSS

I wanted to figure out the fastest way to load non-critical CSS so that the impact on initial page drawing is minimal.

TL;DR: Here's the solution I ended up with: https://github.com/filamentgroup/loadCSS/


For async JavaScript file requests, we have the async attribute to make this easy, but CSS file requests have no similar standard mechanism (at least, none that will still apply the CSS after loading - here are some async CSS loading conditions that do apply when CSS is inapplicable to media: https://gist.github.com/igrigorik/2935269#file-notes-md ).

Seems there are a couple ways to load and apply a CSS file in a non-blocking manner:

@jessejanderson
jessejanderson / intro-to-otp-in-elixir-resources.md
Last active June 15, 2023 05:03
Intro to OTP in Elixir - Resources
@carson-katri
carson-katri / cloth.py
Created December 1, 2022 13:18
Verlet integration in Geometry Script
from geometry_script import *
# Constants
SAMPLES = 3
# Inputs
class ClothInputs(InputGroup):
gravity: Vector = (0, 0, -0.5)
friction: Vector = (0.999, 0.999, 0.999)
stick_length: Float = 0.1
@omnibs
omnibs / phoenix showdown rackspace onmetal io.md
Last active January 25, 2023 18:33
Phoenix Showdown Comparative Benchmarks @ Rackspace

Comparative Benchmark Numbers @ Rackspace

I've taken the benchmarks from Matthew Rothenberg's phoenix-showdown, updated Phoenix to 0.13.1 and ran the tests on the most powerful machines available at Rackspace.

Results

Framework Throughput (req/s) Latency (ms) Consistency (σ ms)
@danomanion
danomanion / Tiny-PWA.png
Last active May 28, 2019 23:06
public images
Tiny-PWA.png
Framework CSS size/gzipped #Elements Custom CSS #CSS Written/Unique Dev Elements
Bootstrap 68kb/12kb 49 0 classes 0 properties 48/34 4.5/5 5/5
Bulma 73kb/10kb 53 2 classes 2 properties 56/37 4.5/5 4.5/5
Foundation 30kb/7kb 56 4 classes 4 properties 46/21 4/5 3.5/5
Milligram 10kb/3kb 49 7 classes 17 properties 34/19 4.5/5 3.5/5
Pure 17kb/4kb 48 7 classes 7 properties 39/27 4/5 3.5/5
SemanticUI 146kb/20kb 47 2 classes 2 properties 90/39 4/5 5/5
UIKit 33kb/6kb 51 0 classes 0 properties 52/31 4.5/5 5/5
<div id="appFunction">
<h2>Returned data as a function.</h2>
<ul>
<li v-for="item in items">
{{ item }}
</li>
</ul>
</div>
<div id="appObject">
@danomanion
danomanion / index.html
Last active March 7, 2019 15:35
Vue.js
<div id="app">
<ul>
<li v-for="item in items">
{{ item }}
</li>
</ul>
</div>