Skip to content

Instantly share code, notes, and snippets.

View wangshijun's full-sized avatar

shijun wangshijun

View GitHub Profile
@xiaolai
xiaolai / markdownhere.css
Created July 2, 2016 12:12
markdown-here-css
.markdown-here-wrapper {
font-size: 16px;
line-height: 1.8em;
letter-spacing: 0.1em;
}
pre, code {
font-size: 14px;
font-family: Roboto, 'Courier New', Consolas, Inconsolata, Courier, monospace;
@josephg
josephg / server.js
Created May 12, 2016 00:58
Slow requires
var tree = require("terminal-tree");
const loadingData = [];
var current = loadingData;
global.wr = (_require) => {
return (name) => {
const start = Date.now();
const parent = current;
current = [];
@skratchdot
skratchdot / donate.md
Created January 25, 2016 17:42
My Paypal donate button in markdown format

Donation Button

Donate

@esamattis
esamattis / WebViewAutoHeight.js
Last active February 11, 2022 16:01
React native: Is it possible to have the height of a html content in a webview? http://stackoverflow.com/q/32952270
/*
DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
Version 2, December 2004
Copyright (C) 2016 Esa-Matti Suuronen <esa-matti@suuronen.org>
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.
@learncodeacademy
learncodeacademy / webpack.config.js
Created January 8, 2016 03:55
Sample Basic Webpack Config
var debug = process.env.NODE_ENV !== "production";
var webpack = require('webpack');
module.exports = {
context: __dirname,
devtool: debug ? "inline-sourcemap" : null,
entry: "./js/scripts.js",
output: {
path: __dirname + "/js",
filename: "scripts.min.js"
@janlay
janlay / README.md
Last active March 6, 2026 15:03
Yet another config for Surge.app

Install

  1. Modify index.txt with your output path and proxy info
  2. Use Text Builder to build configuration for Surge: $ text-builder -index /path/to/index.txt Or run $ sh build-all to build all your index files.
  3. Import configuration via AirDrop/iTunes/Dropbox/iCloud

本人不提供任何保证和技术支持,使用者自负风险。
There are no guarantees, no any support. Use it at your own risk.

@paulirish
paulirish / what-forces-layout.md
Last active May 14, 2026 17:39
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
@mik01aj
mik01aj / README.md
Last active April 21, 2017 13:02
How to use Tether with React

Tether is a great library for positioning stuff (tooltips, modals, hints, etc) in your web app.

But, as I use React, it was pretty problematic for me, as Tether mutates the DOM and React breaks miserably when it sees mutated DOM. The solution is to have the tethered element outside the part of the DOM tree which is controlled by React (in this case, I use document.body).

That's why I created 2 helpers to use Tether with React.

The first one, TetheredElement is a plain JS helper to create a new element, attach it to some other one via Tether, and populate it with some React component.

The second one, TetherTarget is a React component and it uses TetheredElement to integrate it further with React, so that you can attach components to each other with Tether, without leaving the cozy React/JSX world and worrying about manual DOM operations. Just write:

@varemenos
varemenos / 1.README.md
Last active October 9, 2025 17:15
Git log in JSON format

Get Git log in JSON format

git log --pretty=format:'{%n  "commit": "%H",%n  "abbreviated_commit": "%h",%n  "tree": "%T",%n  "abbreviated_tree": "%t",%n  "parent": "%P",%n  "abbreviated_parent": "%p",%n  "refs": "%D",%n  "encoding": "%e",%n  "subject": "%s",%n  "sanitized_subject_line": "%f",%n  "body": "%b",%n  "commit_notes": "%N",%n  "verification_flag": "%G?",%n  "signer": "%GS",%n  "signer_key": "%GK",%n  "author": {%n    "name": "%aN",%n    "email": "%aE",%n    "date": "%aD"%n  },%n  "commiter": {%n    "name": "%cN",%n    "email": "%cE",%n    "date": "%cD"%n  }%n},'

The only information that aren't fetched are:

  • %B: raw body (unwrapped subject and body)
  • %GG: raw verification message from GPG for a signed commit
@xjamundx
xjamundx / blog-webpack-2.md
Last active November 7, 2024 13:10
From Require.js to Webpack - Part 2 (the how)

This is the follow up to a post I wrote recently called From Require.js to Webpack - Party 1 (the why) which was published in my personal blog.

In that post I talked about 3 main reasons for moving from require.js to webpack:

  1. Common JS support
  2. NPM support
  3. a healthy loader/plugin ecosystem.

Here I'll instead talk about some of the technical challenges that we faced during the migration. Despite the clear benefits in developer experience (DX) the setup was fairly difficult and I'd like to cover some of the challanges we faced to make the transition a bit easier.