Skip to content

Instantly share code, notes, and snippets.

👷
Working from home

JIMMY ムン (MOON) ragingwind

👷
Working from home
Block or report user

Report or block ragingwind

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@hackerwins
hackerwins / SortedMap.ts
Created Jun 26, 2018
SortedMap using LLRB Tree.
View SortedMap.ts
/**
* Implementation of an SortedMap using Left-leaning Red-Black Tree
*
* Original paper on Left-leaning Red-Black Trees:
* - http://www.cs.princeton.edu/~rs/talks/LLRB/LLRB.pdf
*
* Invariant 1: No red node has a red child
* Invariant 2: Every leaf path has the same number of black nodes
* Invariant 3: Only the left child can be red (left leaning)
*/
@PaulKinlan
PaulKinlan / manifest-polyfill.html
Last active Feb 27, 2018
Web App Manifest Polyfill for iOS
View manifest-polyfill.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link rel="manifest" href="https://jsbin-user-assets.s3.amazonaws.com/kinlan/manifest.json">
<title>iOS Manifest Polyfill</title>
</head>
<body>
@addyosmani
addyosmani / pwas.md
Last active Jun 12, 2019
💄💋 Progressive Web Apps across popular frameworks that I have written or contributed significantly to
View pwas.md

React HN (Universal rendering, Offline caching, optimisations)

React + Webpack application using the PRPL pattern

@paulirish
paulirish / what-forces-layout.md
Last active Oct 17, 2019
What forces layout/reflow. The comprehensive list.
View what-forces-layout.md

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.

Element

Box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
  • elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
  • elem.getClientRects(), elem.getBoundingClientRect()
View TemplateStrings.md

Japanese translation from the original post in English.

原文: [Getting Literal With ES6 Template Strings by Addy Osmani] (http://updates.html5rocks.com/2015/01/ES6-Template-Strings)

#ES6のテンプレート文字列

従来のJavaScriptの文字列処理はPythonやRubyに比べて非力でしたが、ES6のテンプレート文字列はこの状況を根本的に覆します。(テンプレート文字列はChrome 41からサポートされています。)それによりプログラマはドメイン固有言語(domain-specific language、DSL)を定義する事が可能になります。以下はテンプレート文字列が提供する機能です。

  • 文字列の挿入
  • 式を文字列に埋め込む
@bendc
bendc / functional-utils.js
Last active Sep 26, 2019
A set of pure ES2015 functions aimed to make functional JavaScript more idiomatic.
View functional-utils.js
// array utils
// =================================================================================================
const combine = (...arrays) => [].concat(...arrays);
const compact = arr => arr.filter(Boolean);
const contains = (() => Array.prototype.includes
? (arr, value) => arr.includes(value)
: (arr, value) => arr.some(el => el === value)
@webtobesocial
webtobesocial / pseudo_elements.md
Last active Oct 17, 2019
A CSS pseudo-element is used to style specified parts of an element. In some cases you can style native HTML controls with vendor specific pseudo-elements. Here you will find an list of cross browser specific pseudo-element selectors.
View pseudo_elements.md

Styling native elements

Native HTML controls are a challenge to style. You can style any element in the web platform that uses Shadow DOM with a pseudo element ::pseudo-element or the /deep/ path selector.

video::webkit-media-controls-timeline {
  background-color: lime;
}

video /deep/ input[type=range] {
@addyosmani
addyosmani / package.json
Last active Sep 2, 2019
npm run-scripts boilerplate
View package.json
{
"name": "my-app",
"version": "1.0.0",
"description": "My test app",
"main": "src/js/index.js",
"scripts": {
"jshint:dist": "jshint src/js/*.js",
"jshint": "npm run jshint:dist",
"jscs": "jscs src/*.js",
"browserify": "browserify -s Validating -o ./dist/js/build.js ./lib/index.js",
@addyosmani
addyosmani / README.md
Last active Oct 17, 2019 — forked from 140bytes/LICENSE.txt
108 byte CSS Layout Debugger
View README.md

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

@jeff-minard-ck
jeff-minard-ck / Vagrantfile
Created Jan 10, 2014
vagrant file with HD provisioning
View Vagrantfile
VAGRANTFILE_API_VERSION = "2"
Vagrant.configure(VAGRANTFILE_API_VERSION) do |config|
config.vm.box = "2creatives-centos65-652"
config.vm.box_url = "https://github.com/2creatives/vagrant-centos/releases/download/v6.5.2/centos65-x86_64-20131219.box"
config.vm.hostname = "mymachine.com"
config.vm.synced_folder "salt/root/", "/srv/"
You can’t perform that action at this time.