Skip to content

Instantly share code, notes, and snippets.

Razvan Caliman oslego

Block or report user

Report or block oslego

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 Web components.md

Confusing Components

Do I need all four parts?

  • Custom Elements
  • Shadow DOM
  • HTML Imports
  • HTML Templates

I'm confused as to which bits I need supported. Do I need all of them to blindy create and use other components?

View ES2015 JavaScript Primer.md

We're excited to have you attend one of our workshops! Here's a JavaScript (re)fresher to help you get up-to-speed on some features of the language we'll be using.

Let and Const

JavaScript has always had var:

var name = 'Ryan'
@adactio
adactio / basicServiceWorker.js
Last active Sep 20, 2019
A basic Service Worker, for use on, say, a blog.
View basicServiceWorker.js
'use strict';
// Licensed under a CC0 1.0 Universal (CC0 1.0) Public Domain Dedication
// http://creativecommons.org/publicdomain/zero/1.0/
(function() {
// Update 'version' if you need to refresh the cache
var staticCacheName = 'static';
var version = 'v1::';
@holman
holman / emoji_test.rb
Last active Nov 18, 2018
A snapshot of the tests we use internally at GitHub to help edit our blog posts before they go out to everybody. For more information, take a peek at http://zachholman.com/posts/how-github-writes-blog-posts
View emoji_test.rb
require_relative "test_helper"
require "open-uri"
require "net/http"
class EmojiTest < Blog::Test
def test_no_emoji
posts.each do |post|
content = File.read(post)
refute_match /:[a-zA-Z0-9_]+:/, content,
@domenic
domenic / auto-deploy.md
Last active Dec 1, 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.

View react-app-file-structure
.
├── actions
├── stores
├── views
│   ├── Anonymous
│   │   ├── __tests__
│   │   ├── views
│   │   │   ├── Home
│   │   │   │   ├── __tests__
│   │   │   │   └── Handler.js
@kpdecker
kpdecker / nodebf.md
Last active Jun 2, 2016
mobile.walmart.com #nodebf 2014
View nodebf.md

Mobile Server Side Rendering

This year marks the first year that we are doing full scale rendering of our SPA application on our mobile.walmart.com Node.js tier, which has provided a number of challenges that are very different from the mostly IO-bound load of our prior #nodebf.

The infrastructure outlined for last year is the same but our Home, Item and a few other pages are prerendered on the server using fruit-loops and hula-hoop to execute an optimized version of our client-side JavaScript and provide a SEO and first-load friendly version of the site.

To support the additional CPU load concerns as peak, which we hope will be unfounded or mitigated by our work, we have also taken a variety of steps to increase cache lifetimes of the pages that are being served in this manner. In order of their impact:

Event Loop Management

View how to screencapture and make animated gifs or whathaveyou.md

Screencapture and animated gifs

I say "animated gif" but in reality I think it's irresponsible to be serving "real" GIF files to people now. You should be serving gfy's, gifv's, webm, mp4s, whatever. They're a fraction of the filesize making it easier for you to deliver high fidelity, full color animation very quickly, especially on bad mobile connections. (But I suppose if you're just doing this for small audiences (like bug reporting), then LICEcap is a good solution).

Capturing (Easy)

  1. Launch quicktime player
  2. do Screen recording

screen shot 2014-10-22 at 11 16 23 am

@codler
codler / css-supports.js
Last active Mar 18, 2019
CSS.supports() Polyfill
View css-supports.js
/*! CSS.supports() Polyfill
* https://gist.github.com/codler/03a0995195aa2859465f
* Copyright (c) 2014 Han Lin Yap http://yap.nu; MIT license */
if (!('CSS' in window)) {
window.CSS = {};
}
if (!('supports' in window.CSS)) {
window.CSS._cacheSupports = {};
window.CSS.supports = function(propertyName, value) {
@addyosmani
addyosmani / README.md
Last active Dec 5, 2019 — forked from 140bytes/LICENSE.txt
108 byte CSS Layout Debugger
View README.md

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

You can’t perform that action at this time.