Skip to content

Instantly share code, notes, and snippets.

Bran van der Meer branneman

Block or report user

Report or block branneman

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
View Frontend best practices.md

DOM events

Performance

  • Always use a DocumentFragment when appending children to the main DOM tree.
    • Further reading: mdn
@peeke
peeke / box.es6
Created May 22, 2017
The box pattern
View box.es6
// The box pattern:
// Array chaining methods for single values
const box = v => [ v ]
box(1)
.map(n => n * 2)
.map(n => n + 2)
.pop()
@peeke
peeke / ArrayLikeObservable.es6
Last active May 30, 2017
Array function based Steam & EventStream implementation. Also handles promises.
View ArrayLikeObservable.es6
class Observable {
constructor(fn) {
this._fn = fn;
this._children = [];
const handler = {
get(target, prop) {
return prop in target || !(prop in Array.prototype)
View run-chromedriver-cluster.ps1
param (
[string]$instances = 10
)
docker rm -f selenium-hub
docker run --restart=always -d -p 4444:4444 --name selenium-hub selenium/hub:3.0.0-dubnium
$i=0
while($i -ne $instances)
{
@peeke
peeke / DataStore.js
Last active Oct 21, 2016
A single data store for modules to communicate with.
View DataStore.js
/**
* A single data store for modules to communicate with. Keeping 'the truth' in a single place reduces bugs and allows
* for greater seperation of concerns.
*
* The module can be used as a singleton through DataStore.getSingleton('key'), or on instance basis through the new keyword.
*
* Uses the Observer module found here: https://gist.github.com/peeke/42a3f30c2a3856c65c224cc8a47b95f9
*
* @name DataStore
* @author Peeke Kuepers
@peeke
peeke / observer.js
Last active Sep 21, 2017
Used for inter-object communication. (Semi-)drop in replacement for Rik Schennink's Observer.
View observer.js
/**
* Used for inter-object communication.
* (Semi-)drop in replacement for Rik Schennink's Observer.
*
* Implementation differences:
* - ES6
* - The use of WeakMaps
* - inform() and conceal() don't return a boolean indicating success.
* - Subscription fn's are called with seperate arguments, instead of one data parameter. This is backwards compatible.
*
View model-mixin.js
import Events from 'eventemitter3';
const modelMixin = Object.assign({
attrs: {},
set (name, value) {
this.attrs[name] = value;
this.emit('change', {
prop: name,
value: value
@craigbeck
craigbeck / introspection-query.graphql
Created Apr 6, 2016
Introspection query for GraphQL
View introspection-query.graphql
query IntrospectionQuery {
__schema {
queryType { name }
mutationType { name }
subscriptionType { name }
types {
...FullType
}
directives {
@sebmarkbage
sebmarkbage / Enhance.js
Last active May 10, 2019
Higher-order Components
View Enhance.js
import { Component } from "React";
export var Enhance = ComposedComponent => class extends Component {
constructor() {
this.state = { data: null };
}
componentDidMount() {
this.setState({ data: 'Hello' });
}
render() {
@domenic
domenic / auto-deploy.md
Last active May 19, 2019
Auto-deploying built products to gh-pages with Travis
View auto-deploy.md

Auto-deploying built products to gh-pages with Travis

This is a set up for projects which want to check in only their source files, but have their gh-pages branch automatically updated with some compiled output every time they push.

Create a compile script

You want a script that does a local compile to e.g. an out/ directory. Let's call this compile.sh for our purposes, but for your project it might be npm build or gulp make-docs or anything similar.

The out/ directory should contain everything you want deployed to gh-pages. That almost always includes an index.html.

You can’t perform that action at this time.