amboutwe

<?php
/********* DO NOT COPY THE PARTS ABOVE THIS LINE *********/
/* Remove Yoast SEO Change existing title or meta template variable
 * Credit: Moshe Harush
 * https://stackoverflow.com/questions/36281915/yoast-seo-how-to-create-custom-variables
 * Last Tested: Unknown
 */
 
 // define the wpseo_replacements callback
function filter_wpseo_replacements( $replacements ) {

ilyaigpetrov

Meteor Alternatives Per Feature

This table was created in 2015 so may be quite outdated today.

Feature	Meteor Solution	Alternative Solutions	Description
Live DB Sync	[livequery][lq] ([mongo-oplog]), [ddp]	RethinkDB, Redis, ShareDB, [npm:mongo-oplog], [firebase], etc.	Push DB updates to client/server.
Latency Compensation, Optimistic UI	[minimongo][mm]	[RethinkDB][lcr], [mWater/minimongo] (fork, not ws but http, browserify)	Imitate successful db query on client before it is done.
Isomorphic Code	[isobuild] & isopacks	browserify	Write one code for server/client/mobile.
Isomorphic Packaging	[isobuild], atmosphere		No more separate packages for server & client. Get bower + npm + mobile.

scottjehl

I wanted to figure out the fastest way to load non-critical CSS so that the impact on initial page drawing is minimal.

TL;DR: Here's the solution I ended up with: https://github.com/filamentgroup/loadCSS/

---

For async JavaScript file requests, we have the async attribute to make this easy, but CSS file requests have no similar standard mechanism (at least, none that will still apply the CSS after loading - here are some async CSS loading conditions that do apply when CSS is inapplicable to media: https://gist.github.com/igrigorik/2935269#file-notes-md ).

Seems there are a couple ways to load and apply a CSS file in a non-blocking manner:

swalkinshaw

Moved to Shopify/graphql-design-tutorial

amboutwe

<?php
/********* DO NOT COPY THE PARTS ABOVE THIS LINE *********/

/* Change size for Yoast SEO OpenGraph image for all content 
 * Credit: Yoast Development team
 * Last Tested: May 19 2020 using Yoast SEO 14.1 on WordPress 5.4.1
 * Accepts WordPress reserved image size names: 'thumb', 'thumbnail', 'medium', 'large', 'post-thumbnail'
 * Accepts custom image size names: https://developer.wordpress.org/reference/functions/add_image_size/
 */
 

padolsey

// ----------------------------------------------------------
// A short snippet for detecting versions of IE in JavaScript
// without resorting to user-agent sniffing
// ----------------------------------------------------------
// If you're not in IE (or IE version is less than 5) then:
//     ie === undefined
// If you're in IE (>=5) then you can determine which version:
//     ie === 7; // IE7
// Thus, to detect IE:
//     if (ie) {}

hatefulcrawdad

// --------------------------------------------------------------------------------------
// A More Modern Scale for Web Typography
// Based on this article: http://typecast.com/blog/a-more-modern-scale-for-web-typography
// --------------------------------------------------------------------------------------

$body-font-size: 1em !default;

// Adjusts body typography to be default
// for each browser.
@mixin reset-body-font-size($font-size: 100%, $size-adjustment: 0.5) {

kosamari

ServiceWorker for github pages

This is a ServiceWorker template to turn small github pages into offline ready app.

Why ?

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.

Notes

Make sure your github pages have HTTPS enforced, you can check Settings > GitHub Pages > Enforce HTTPS of your repository.

PaulKinlan

(function() { 
  var CSSCriticalPath = function(w, d, opts) {
    var opt = opts || {};
    var css = {};
    var pushCSS = function(r) {
      if(!!css[r.selectorText] === false) css[r.selectorText] = {};
      var styles = r.style.cssText.split(/;(?![A-Za-z0-9])/);
      for(var i = 0; i < styles.length; i++) {
        if(!!styles[i] === false) continue;
        var pair = styles[i].split(": ");

pixelhandler

#!/bin/sh

# Called by "git push" after it has checked the remote status,
# but before anything has been pushed.
#
# If this script exits with a non-zero status nothing will be pushed.
#
# Steps to install, from the root directory of your repo...
# 1. Copy the file into your repo at `.git/hooks/pre-push`
# 2. Set executable permissions, run `chmod +x .git/hooks/pre-push`