Skip to content

Instantly share code, notes, and snippets.

View thomas-lebeau's full-sized avatar
🐶

Thomas Lebeau thomas-lebeau

🐶
View GitHub Profile
/**
* A quick way of using Markdown inside JSX: via tagged templates
*
* Downsides:
* – Works completely dynamically (no static compilation)
* – Big downside: You must escape backticks.
* Potential work-around in template tag function: result.replace(/∆/ug, '`')
*
* Upsides:
* – Preserves line breaks (JSX doesn’t)
@paulirish
paulirish / what-forces-layout.md
Last active May 21, 2024 09: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
@bastianallgeier
bastianallgeier / mywidget.php
Created March 9, 2015 10:54
Most basic widget setup for panel widgets. You would put those two files in /site/widgets/mywidget/
<?php
return array(
'title' => 'Widget Title',
'html' => function() {
// any data for the template
$data = array();
return tpl::load(__DIR__ . DS . 'template.php', $data);
}
);
@kimus
kimus / ufw.md
Created March 2, 2014 22:46
NAT and FORWARD with Ubuntu’s ufw firewall

UFW

I use Ubuntu’s Uncomplicated firewall because it is available on Ubuntu and it's very simple.

Install UFW

if ufw is not installed by default be sure to install it first.

@undoZen
undoZen / less-middleware-with-sourcemap.js
Last active December 18, 2015 15:49
a simple less middleware with source map, usage: app.use(lessMiddleware(path.join(__dirname))); -- only works for __dirname right now.
var less = require('less');
var fs = require('fs');
var path = require('path');
var SourceMapGenerator = require('source-map').SourceMapGenerator
function errfn(callback) {
return function (err) {
if (err) callback.call(this, err);
else callback.apply(this, [].slice.apply(arguments).slice(1));
}
@jonathanmoore
jonathanmoore / gist:2640302
Created May 8, 2012 23:17
Get the share counts from various APIs

Share Counts

I have always struggled with getting all the various share buttons from Facebook, Twitter, Google Plus, Pinterest, etc to align correctly and to not look like a tacky explosion of buttons. Seeing a number of sites rolling their own share buttons with counts, for example The Next Web I decided to look into the various APIs on how to simply return the share count.

If you want to roll up all of these into a single jQuery plugin check out Sharrre

Many of these API calls and methods are undocumented, so anticipate that they will change in the future. Also, if you are planning on rolling these out across a site I would recommend creating a simple endpoint that periodically caches results from all of the APIs so that you are not overloading the services will requests.

Twitter

@liamcurry
liamcurry / gist:2597326
Created May 4, 2012 19:56
Vanilla JS vs jQuery

Moving from jQuery

Events

// jQuery
$(document).ready(function() {
  // code
})
@twosixcode
twosixcode / gist:1988097
Created March 6, 2012 18:40
Make "Paste and Indent" the default paste in Sublime Text 2
// swap the keybindings for paste and paste_and_indent
{ "keys": ["super+v"], "command": "paste_and_indent" },
{ "keys": ["super+shift+v"], "command": "paste" }
@xtian
xtian / html5boilerplate.jade
Last active December 23, 2023 15:05
HTML5 Boilerplate in jade
!!! 5
html(class='no-js')
head
meta(charset='utf-8')
meta(http-equiv='X-UA-Compatible', content='IE=edge')
title
meta(name='description', content='')
meta(name='viewport', content='width=device-width, initial-scale=1')