Skip to content

Instantly share code, notes, and snippets.

View senthilp's full-sized avatar

Senthil Padmanabhan senthilp

View GitHub Profile
@senthilp
senthilp / lazy.js
Created April 22, 2021 18:21
lazy-loading property pattern for classes
class MyClass {
constructor() {
const instance = this;
Object.defineProperty(this, "data", {
get() {
const actualData = "Something big...";
console.log(this === instance); // true
let o_cls = 0,
o_lcp = 0;
const observerFirstInput = new PerformanceObserver(function(list) {
list.getEntries().forEach(function (entry) {
beacon.add('fid', entry.processingStart - entry.startTime); // Observer First Input Delay
});
});
const observerLayoutShift = new PerformanceObserver(function(list) {
SELECT
origin,
MULTIPLY(ROUND(SUM(IF(first_contentful_paint.histogram.bin.start < 1000, first_contentful_paint.histogram.bin.density , 0)) / SUM( first_contentful_paint.histogram.bin.density ), 4), 100) AS fast_AboveTheFold,
MULTIPLY(ROUND(SUM(IF(first_contentful_paint.histogram.bin.start >= 1000 AND first_contentful_paint.histogram.bin.start < 3000, first_contentful_paint.histogram.bin.density, 0)) / SUM(first_contentful_paint.histogram.bin.density), 4), 100) AS average_AboveTheFold,
MULTIPLY(ROUND(SUM(IF(first_contentful_paint.histogram.bin.start >= 3000, first_contentful_paint.histogram.bin.density, 0)) / SUM(first_contentful_paint.histogram.bin.density), 4), 100) AS slow_AboveTheFold
FROM
[chrome-ux-report:all.201904]
WHERE
origin IN ('https://www.ebay.com', 'https://www.amazon.com') AND
form_factor.name = "desktop"
@senthilp
senthilp / subscribe.js
Last active August 2, 2018 17:07
Subscription steps
async function subscribe(syncToken = false) {
try {
// STEP 1: Load and init firebase SDK
await loadAndInitFirebase('firebase');
const messaging = firebase.messaging();
// STEP 2: Use registered Service Worker
const swReg = await getServiceWorkerRegistration();
messaging.useServiceWorker(swReg);
@senthilp
senthilp / push.js
Last active August 15, 2018 14:40
eBay Push Subscription
/* global firebase */
'use strict';
const chauffeurElem = document.querySelector('.chauffeur-script');
function lazyLoad(url) {
return new Promise((resolve, reject) => {
const scriptElem = document.createElement('script');
scriptElem.type = 'application/javascript';
scriptElem.async = true;
<ebay-breadcrumb nofollow>
<ebay-breadcrumb-item href="https://..." _sp="">eBay</ebay-breadcrumb-item>
<ebay-breadcrumb-item href="https://..." _sp="">Auto Parts and Vehicles</ebay-breadcrumb-item>
<ebay-breadcrumb-item href="https://..." _sp="">Motors Parts and Accessories</ebay-breadcrumb-item>
</ebay-breadcrumb>
<!-- with JSON LD -->
<ebay-breadcrumb>
<ebay-breadcrumb-item href="https://..." _sp="">
eBay
SELECT
origin,
effective_connection_type.name AS ect,
MULTIPLY(ROUND(SUM( first_contentful_paint.histogram.bin.density), 4), 100) AS density
FROM
[chrome-ux-report:all.201711]
WHERE
origin IN ('https://m.ebay.com', 'https://www.amazon.com') AND
form_factor.name = "phone"
GROUP BY
@senthilp
senthilp / sw-full.js
Last active October 30, 2017 07:27
Offline Service Worker
const VERSION = '{%VERSION%}';
const ASSETS = [];
const ALLOWED_URL_PATHS = [
'/'
];
let offlineReady = false;
let offlinePage = undefined;
function requestExpectsHTML(headers) {
if (!headers) {
const carouselElement = document.querySelector('#carousel1');
Object.defineProperty(carouselElement, 'index', {
set(idx) {
// First check if it is numeric
const numericIndex = parseInt(idx, 10);
if (isNaN(numericIndex)) {
return;
}
// Update the internal state
this._index = numericIndex;
class MyCarousel extends HTMLElement {
static get observedAttributes() {
return ['index'];
}
// Called anytime the 'index' attribute is changed
attributeChangedCallback(attrName, oldVal, newVal) {
this[attrName] = newVal;
}
// Takes an index value
set index(idx) {