pure() can be used as a higher order function or a decorator.
When passed a pure functional component, it wraps the function in a classful Component with a shouldComponentUpdate() that ignores renders for unchanged props.
When passed a classful Component, it injects a shouldComponentUpdate() method into the Component's prototype that ignores renders for unchanged props & state.
import pure from 'pure-component';
When you use the names property in the CommonsChunkPlugin({}) and pass an array as the value, webpack converts what is seen below:
new webpack.optimize.CommonsChunkPlugin({
names: ['app', 'vendor', 'manifest'], // creating manifest.js
minChunks: Infinity
})Into:
NOTE: This is no longer an experiment! You can use the accessibility inspector in Chrome Devtools now, including a fantastic color contrast inspection tool. Read more: https://developers.google.com/web/updates/2018/01/devtools#a11y
Just like any good element inspector helps you debug styles, accessibility inspection in the browser can help you debug HTML and ARIA exposed for assistive technologies such as screen readers. There's a similar tool in Safari (and reportedly one in Edge) but I like the Chrome one best.
As an internal Chrome experiment, this tool differs from the Accessibility Developer Tools extension in that it has privileged Accessibility API access and reports more information as a result. You can still use the audit feature in the Chrome Accessibility Developer Tools, or you could use the aXe Chrome extension. :)
To enable the accessibility inspector in Chrome stable:
| Go to: chrome://settings/searchEngines | |
| Add a new search engine with the following settings | |
| Gif | Gif | https://www.google.com/search?q=%s&tbm=isch&tbs=itp:animated | |
| Type gif in the address bar press TAB and enter your search query |
| import { createProxyServer } from 'http-proxy'; | |
| import url from 'url'; | |
| import _ from 'lodash'; | |
| module.exports = app => { | |
| const proxy = createProxyServer(); | |
| app.all('/api/v1/*', (req, res) => { | |
| const path = _.drop(req.url.split('/'), 3); | |
| proxy.proxyRequest(req, res, { | |
| target: url.resolve('YOUR URL', path.join('/')), |
This is a ServiceWorker template to turn small github pages into offline ready app.
Whenever I make small tools & toys, I create github repo and make a demo page using github pages (like this one).
Often these "apps" are just an index.html file with all the nessesary CSS and JavaScript in it (or maybe 2-3 html/css/js files). I wanted to cache these files so that I can access my tools offline as well.
Make sure your github pages have HTTPS enforced, you can check Settings > GitHub Pages > Enforce HTTPS of your repository.
With the release of Node 6.0.0, the surface of code that needs transpilation to use ES6 features has been reduced very dramatically.
This is what my current workflow looks like to set up a minimalistic and fast microservice using micro and async + await.
| npm ls | grep -oP "\w[^@]+@" | sed s/@// | sort |uniq | awk '{print "npm view " $1 " repository.url"}' | sh | grep -oP "github(\w|\W)+\.git" | sed 's/.git//g' | sed 's/.com/.com\/repos/g' | awk '{print "curl -s \"https://api."$1"\" | grep -P \"(stargazers_count|full_name)\" "}' | sh |
| global | |
| log /dev/log local0 | |
| log /dev/log local1 notice | |
| chroot /var/lib/haproxy | |
| stats socket /run/haproxy/admin.sock mode 660 level admin | |
| stats timeout 30s | |
| user haproxy | |
| group haproxy | |
| daemon | |
| maxconn 2048 |
