A tiny ~150-byte polyfill for Promise.prototype.finally
.
Useful for browsers that support Promise but not the .finally()
method.
npm install finally-polyfill
<? | |
// | |
// AUTO KEYWORD-BASED FOLLOWER CURATION BOT (by @levelsio) | |
// | |
// File: twitterFollowerCuratorBot.php | |
// | |
// Created: May 2021 | |
// License: MIT | |
// |
This is some sort of answer to recent posts regarding Web Components, where more than a few misconceptions were delivered as fact.
Let's start by defining what we are talking about.
As you can read in the dedicated GitHub page, Web Components is a group of features, where each feature works already by itself, and it doesn't need other features of the group to be already usable, or useful.
Photo by Ricardo Gomez Angel on Unsplash
This gist is a collection of common patterns I've personally used here and there with Custom Elements.
These patterns are all basic suggestions that could be improved, enriched, readapted, accordingly with your needs.
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.
elem.offsetLeft
, elem.offsetTop
, elem.offsetWidth
, elem.offsetHeight
, elem.offsetParent
<!doctype html> | |
<html> | |
<head> | |
<title>Blur!</title> | |
</head> | |
<body> | |
<div id="box1" class="box blurred-bg tinted"> | |
<h1>Blurred Background</h1> | |
<h2>By Flurin Egger, inspired by <a href="http://ariona.net">Ariona, Rian</a></h2> |
###Edit this file
/etc/nginx/nginx.conf
###Add this line anywhere inside the http { }
block:
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
###Go to your Forge panel and restart Nginx
(by @andrestaltz)
If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.
<script type="text/javascript"> | |
(function () { | |
"use strict"; | |
// once cached, the css file is stored on the client forever unless | |
// the URL below is changed. Any change will invalidate the cache | |
var css_href = './index_files/web-fonts.css'; | |
// a simple event handler wrapper | |
function on(el, ev, callback) { | |
if (el.addEventListener) { | |
el.addEventListener(ev, callback, false); |