Skip to content

Instantly share code, notes, and snippets.

View Hotell's full-sized avatar
🎯
Focusing

Martin Hochel Hotell

🎯
Focusing
415 followers · 16 following
View GitHub Profile
@treshugart
treshugart / example.js
Last active December 7, 2020 04:02
Pseudo shadow DOM at the custom element level. When element is updated, `childNodes` is set, thus it's a single entry point for updates. Custom distribution is required.
/** @jsx h */
// You only need custom elements for this!!!
import 'skatejs-web-components/src/native-shim';
import { Component, define, h, prop } from 'skatejs';
import ShadowNode, { scopeCss, scopeTree } from './shadow-node';
// Converts real DOM nodes into Incremental DOM nodes.
//
// This is orthogonal to this gist, but makes it so we can distribute real
@samthor
samthor / shadowlisten.js
Last active May 18, 2020 18:55
Listener to provide up-to-date Shadow DOM focus events
/**
* Copyright 2017 Google Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
@developit
developit / preact-8-changes.md
Last active August 25, 2017 00:51
Important changes coming in Preact 8

Removed: Element Recycling

DOM Element recycling will be removed in Preact 8.

This should have no effect on most applications. In fact, it fixes a number of known issues related to element state not being fully reset on reuse.

💡 Why? Many DOM properties are stateful, and trying to reset them all when recycling is a game of whack-a-mole. Preact's size makes it infeasible to use whitelists to address these issues, so recycling is being dropped. >

@treshugart
treshugart / example.jsx
Last active March 10, 2020 06:48
Give yourself full control over the DOM that any hyperscript VDOM style function creates http://www.webpackbin.com/4kR0ZnXFf
import hify from './create-element';
import React from 'react';
import { render } from 'react-dom';
const h = hify(React.createElement.bind(React));
class Test extends HTMLElement {
static observedAttributes = ['attr']
attributeChangedCallback (name, oldValue, newValue) {
this.innerHTML = `Hello, ${this.getAttribute('attr')}!`;
@vire
vire / goReactive-2016.md
Last active September 12, 2016 13:40

Reviewer's checklist - How to boost your code review skills

Purpose of my lightning talk is to present insights I've reached as a reviewer/ reviewee in the last couple of months.

I will answer these questions:

  • What makes a good code review good?
  • How to build guidelines? Dos and Don'ts.
  • How to educate dev/team members about the code review process?
@johnlindquist
johnlindquist / angular2-components.md
Last active November 27, 2021 09:18
Angular 2 Components
@aciccarello
aciccarello / RouteConfig.ts
Last active June 3, 2016 06:03
Created as a proof of concept for a decorator that attaches the state config to a controller class and a factory for registering route configs from the class.
/**
* Decorator for controller classes for route states. You can reference the class in the
* `controller` property. Name is a required property on the config if using the
* registerState helper.
* @return Function which takes a UI Router config object.
*/
export default RouteConfig(target) {
return function(config) {
target.$uiRouteConfig = config;
}
@elmariofredo
elmariofredo / remove-javascript-files.sh
Last active November 30, 2015 17:08
Remove javascript files from typescript project
#!/bin/zsh
find . -name '*.js.map' -exec sh -c 'rm ${0%.map}.js $0' {} \;
@staltz
staltz / migration-guide.md
Last active December 19, 2023 22:14
How to show migration guides in GitHub Markdown

How to show migration guides in GitHub Markdown

Use the diff code highlighting tag.

  ```diff
  - foo
  + bar

Example:

@ericelliott
ericelliott / defaults-overrides.md
Last active May 7, 2023 13:52
ES6 defaults / overrides pattern

ES6 Defaults / Overrides Pattern

Combine default parameters and destructuring for a compact version of the defaults / overrides pattern.

function foo ({
    bar = 'no',
    baz = 'works!'
  } = {}) {