potch

This is a mix of perceptions and feelings- correct them as necessary. I don't work on the spec nor the implementation of the standard- I speak as a potential user of the functionality. I assert I am still permitted an opinion.

• How to I make HTML Imports production-ready on present-day networks without vulcanize? HTML Imports produces many, many requests.
• How do I reconcile ES6 modules with HTML Imports?
• Will package managers learn to support HTML Import bundles?
• Many, many modern frameworks treat HTML markup as presentation layer, not data/application layer.

This is what I can think of off the top of my head.

potch

         _            _                    .~-,
        | |          | |                 .' `,>
      __| | ___  __ _| |              .D'   ,>  <7`,
     / _` |/ _ \/ _` | |            ,` |   ,>  <7  }
    | (_| |  __/ (_| | |           {   D   !> <7  /
     \__,_|\___|\__,_|_|           {  /    j_7`  !
          _ _   _       _ _        : /          j'
         (_) | | |     (_) |        `,         ]
__      ___| |_| |__    _| |_        F        }
\ \ /\ / / | __| '_ \  | | __|      F       , {

potch

<?php

header("Content-type: image/png");
$bgs = array("bg1.png", "bg2.png", "bg3.png", "bg4.png");
$im = imagecreatetruecolor(512, 132);
$im2 = imagecreatefrompng($bgs[array_rand($bgs)]);
$wm = imagecolorallocatealpha($im, 255, 255, 255, 64);
$black = imagecolorallocatealpha($im, 0, 0, 0, 32);
$background = imagecolorallocate($im, 0, 0, 0);
$ctext = imagecolorallocate($im, 255, 72, 16);

potch

blink {
  animation: blink 1s step-start infinite alternate;
}
@keyframes blink {
  50% { visibility: hidden }
}

potch

Brick style rules proposal

Our goal is to reduce collision with page styles without Shadow DOM. This is a proposal for rules that will be linter-enforced to ensure that.

Prefer class-based selectors whenever affected markup is part of a component. Prefer tag or [attribute] for markup is authored by users.

Tag Selectors

Never use tag selectors unless they are direct descendants of component markup:

potch

/* jshint node:true */
'use strict';

var bowerDist = require('gulp-bower-dist');
var bump = require('gulp-bump');
var connect = require('gulp-connect');
var ghpages = require('gulp-gh-pages');
var helptext = require('gulp-helptext');
var jshint = require('gulp-jshint');
var rename = require('gulp-rename');

potch

`
<h2>Messages (${ messages.length }):</h2>
<ul>
  ${ messages.map(((msg, i) => `
    <li class="${ i % 2 ? 'odd' : 'even' }">
      ${ msg.subject }
      ${ msg.read ?
        `this message is read`
        :
        `this message is unread`

potch

function Debounce(fn, ms) {
  this.timeout = null;
  this.fn = fn;
  this.ms = ms;
}
Debounce.prototype.start = function () {
  this.timeout = setTimeout(this.fn, this.ms);
};
Debounce.prototype.reset = function () {
  this.abort();

potch

// worker.js
importScripts('commonjs.js');

var marked = require('marked');

var html = marked('# Hello World!');
postMessage(html);

potch

function VRCard() {
  var self = this;
  var container = document.createElement('div');
  self.container = container;
  self.scene = new THREE.Scene();
}

// Just a helper for VRCard.scene.
VRCard.prototype.getScene = function () {