Eric Bidelman ebidel

## app.html
<!DOCTYPE html>
<html>
<head>
  <style>
    body.loading #splash {
      opacity: 1;
    }
    #splash {
      position: absolute;
      top: 0;

## app.html
<!DOCTYPE html>
<html>
<head>
  <style>
    body.loading #splash {
      opacity: 1;
    }
    #splash {
      position: absolute;
      top: 0;

## imports_timing.js
// Know how fast your HTML Imports are.
// crbug.com/505279 - doesn't show sub-import resources.
var imports = document.querySelectorAll('link[rel="import"]');
[].forEach.call(imports, function(link) {
  var entries = performance.getEntriesByName(link.href);
  console.info('=== HTML Imports perf ===');
  entries.forEach(function(e) {
    console.log(e.name, 'took', e.duration, 'ms');
  });
});

## es6-meta-programming.js
// ES6 meta programming ???

// The more complex form of ES6 template strings are called
// "tagged" template strings. In short, they allow you to
// pass the final evaluated string to a function for further
// processing. This allows for some interesting things. For example:
//
//    get`https://api.github.com/repos/${org}/${repo}/issues?sort=${sort}`;
//
// _could_ make a network request and return a Promise with the result

## object-observe-proxy-polyfill.js
// An `Object.observe()` "polyfill" using ES6 Proxies.
//
// Current `Object.observe()` polyfills [1] rely on polling
// to watch for property changes. Proxies can do one better by
// observing property changes to an object without the need for
// polling.
//
// Known limitations of this technique:
// 1. the call signature of `Object.observe()` will return the proxy
//    object. The original object needs to be overwritten with this return value.

## polymer-perf-bookmarklet.js
javascript:(function(){(function printStats(){var loadTimes=window.chrome.loadTimes();firstPaint=loadTimes.firstPaintTime*1000;firstPaintTime=firstPaint-(loadTimes.startLoadTime*1000);console.info('First paint took',firstPaintTime,'ms');console.info('Load took',performance.timing.loadEventStart-performance.timing.navigationStart,'ms');var instances=0;if(parseFloat(Polymer.version)<1){instances=[].slice.call(document.querySelectorAll('html /deep/ *')).filter(function(el){return el.localName.indexOf('-')!=-1||el.getAttribute('is');}).length;}else{instances=Polymer.telemetry.instanceCount;}console.info('Custom element instances:',instances);var reflectCount=0;if(Polymer.telemetry){console.info('=== Properties set to reflectToAttribute ===');Polymer.telemetry.registrations.forEach(function(el){for(var prop in el.properties){if(el.properties[prop].reflectToAttribute){console.log(el.is+'.'+prop);reflectCount++;}}});}else{console.info('=== Properties set to reflect ===');Polymer.elements.forEach(function(el){for(var

## dom-property-watcher.js
// Watch accesses/sets on a DOM element property.
function watchPropsOn(el) {
  return new Proxy(el, {
    get(target, propKey, receiver) {
      //return Reflect.get(target, propKey, receiver);
            console.log('get', propKey);
      return el[propKey];
    },
    set(target, propKey, value, receiver) {
      console.log('set', propKey, value);

## unused-html-imports-bookmarket.js
javascript:(function(){'use strict';var _temporalUndefined={};function _temporalAssertDefined(val,name,undef){if(val===undef){throw new ReferenceError(name+' is not defined - temporal dead zone');}return true;}(function(){'use strict';var els=_temporalUndefined;var allCustomElements=_temporalUndefined;var polymerRegisteredElements=_temporalUndefined;var diff=_temporalUndefined;function isCustomEl(el){return el.localName.indexOf('-')!=-1||el.getAttribute('is');}els=[].slice.call(document.querySelectorAll('html /deep/ *')).filter(function(el){return isCustomEl(el);}).map(function(el){return el.getAttribute('is')||el.localName;});allCustomElements=new Set(_temporalAssertDefined(els,'els',_temporalUndefined)&&els);polymerRegisteredElements=Polymer.telemetry.registrations.map(function(el){return el.is;}).filter(function(name){var blacklist=_temporalUndefined;blacklist=['dom-template','array-selector','custom-style'];return(_temporalAssertDefined(blacklist,'blacklist',_temporalUndefined)&&blacklist).indexOf(name)==

## load_import.js
/**
 * Convenience for dynamically loading an HTML Import.
 *
 * This method creates a new `<link rel="import">` element with
 * the provided URL and appends it to the document to start loading. By default,
 * it loads async to not blocking rendering.
 *
 * @param {string} href The URL to load.
 * @param {boolean} opt_async True if import should be async. Default: true.
 * @return {Promise(HTMLLinkElement, Error)} A promise that resolves with the

## firstpaint.js
(function() {
  'use strict';

  // First paint perf.
  if (window.chrome && window.chrome.loadTimes) {
    const getFP = function() {
      let load = chrome.loadTimes();
      let fp = (load.firstPaintTime - load.startLoadTime) * 1000;
      return Math.round(fp);
    };
	<!DOCTYPE html>
	<html>
	<head>
	<style>
	body.loading #splash {
	opacity: 1;
	}
	#splash {
	position: absolute;
	top: 0;
	// Know how fast your HTML Imports are.
	// crbug.com/505279 - doesn't show sub-import resources.
	var imports = document.querySelectorAll('link[rel="import"]');
	[].forEach.call(imports, function(link) {
	var entries = performance.getEntriesByName(link.href);
	console.info('=== HTML Imports perf ===');
	entries.forEach(function(e) {
	console.log(e.name, 'took', e.duration, 'ms');
	});
	});
	// ES6 meta programming ???

	// The more complex form of ES6 template strings are called
	// "tagged" template strings. In short, they allow you to
	// pass the final evaluated string to a function for further
	// processing. This allows for some interesting things. For example:
	//
	// get`https://api.github.com/repos/${org}/${repo}/issues?sort=${sort}`;
	//
	// _could_ make a network request and return a Promise with the result
	// An `Object.observe()` "polyfill" using ES6 Proxies.
	//
	// Current `Object.observe()` polyfills [1] rely on polling
	// to watch for property changes. Proxies can do one better by
	// observing property changes to an object without the need for
	// polling.
	//
	// Known limitations of this technique:
	// 1. the call signature of `Object.observe()` will return the proxy
	// object. The original object needs to be overwritten with this return value.
	// Watch accesses/sets on a DOM element property.
	function watchPropsOn(el) {
	return new Proxy(el, {
	get(target, propKey, receiver) {
	//return Reflect.get(target, propKey, receiver);
	console.log('get', propKey);
	return el[propKey];
	},
	set(target, propKey, value, receiver) {
	console.log('set', propKey, value);
	/**
	* Convenience for dynamically loading an HTML Import.
	*
	* This method creates a new `<link rel="import">` element with
	* the provided URL and appends it to the document to start loading. By default,
	* it loads async to not blocking rendering.
	*
	* @param {string} href The URL to load.
	* @param {boolean} opt_async True if import should be async. Default: true.
	* @return {Promise(HTMLLinkElement, Error)} A promise that resolves with the
	(function() {
	'use strict';

	// First paint perf.
	if (window.chrome && window.chrome.loadTimes) {
	const getFP = function() {
	let load = chrome.loadTimes();
	let fp = (load.firstPaintTime - load.startLoadTime) * 1000;
	return Math.round(fp);
	};