motss

#! /bin/bash

clear

echo -e "#1 - Removing build/ directory for a fresh build of the project..."
if [ -d "build/" ]; then
  rm -rf build/
fi

echo -e "\n#2 = Building project..."

motss

Possible unexpected errors with resolutions:

1. polymer-build breaks the app-storage/app-indexeddb-mirror element #22
2. How I resolve SyntaxError: expected expression, got '<'

motss

// Not too sure if it will trigger layout and paint for other CSS properties.
// I just use opacity which only triggers composite by default!
function hasNativeCSSProperties() {
 const opacity = 1;
 const el = document.body;
 let hasNativeCSSProperties = false;

 // Setup CSS properties.
 el.style.setProperty('--test-opacity', opacity);
 el.style.setProperty('opacity', 'var(--test-opacity)');

motss

By default the memory limit in Node.js is 512MB.

This will cause FATAL ERROR- JS Allocation failed – process out of memory when processing large data files.

It can be avoided by increasing the memory limit.

See Command-line options for more details.

node --max-old-space-size=1024 server.js # increase to 1gb

motss

How to create your own snippet for VS Code - https://code.visualstudio.com/Docs/customization/userdefinedsnippets

How to publish your own snippet for VS Code - https://code.visualstudio.com/docs/tools/vscecli#_publishers-and-personal-access-tokens

Simple pre-requisites.

1. npm install -g vsce
2. Create a free account at https://www.visualstudio.com/en-us/get-started/setup/sign-up-for-visual-studio-online
3. Create your publisher name - vsce create-publisher (publisher name)
4. Create Extension manifest (package.json). More details at https://code.visualstudio.com/docs/extensionAPI/extension-manifest
5. vsce publish // OR vsce publish major|minor|patch
6. DONE. Your snippet is now up on VS Code's Extensions marketplace.

motss

d = new Date();
dl = new Date(d.getTime() - d.getTimezoneOffset() * 60 * 1E3);

console.log(d);
console.log(dl.toISOString());
console.log(d.getTimezoneOffset / -60);

motss

// This is render blocking the main thread.
const tasks = 1E6;
for (let i = 0; i < tasks; i++) {
  window.requestAnimationFrame(() => {
    const el = document.createElement('div');

    el.style.height = '64px';
    el.textContent = i;

    document.body.appendChild(el);

motss

try {
  throw new Error('failed before promise'); // try...catch: Error: failed before promise.

  Promise.resolve()
   .then(() => {
    throw new Error('fatal error'); // Promise failed: Error: fatal error.
   })
   .catch(err => {
     console.error('Promise failed: ', err);
     return Promise.reject(err); // Uncaught Exception: Error: fatal error.

motss

/**
 * Long polling happens in each successive `interval` and the long polling only allows to continue for `maxDuration`.
 * `maxDuration` determines the time at which enough useful information has been gathered over the intervals,
 * after all, things that too slow possess lesser significance by assumptions else they need to be improved
 * if they are really important as no important/ high priority should load this slow.
 * See [RAIL model](https://developers.google.com/web/fundamentals/performance/rail) for more info.
 *
 * Required parameters:
 * 1. interval - how long the subsequent polling starts.
 * 2. max duration - time reached to send out whatever has been gathered at that point.

motss

{
  const containerWidth = window.innerWidth;
  const maxImgWidth = containerWidth / 4;
  const allImg = [...document.querySelectorAll('#grid > .item')];

  console.log(maxImgWidth);

  allImg.map((img, idx) => {
    const cachedRect = img.getBoundingClientRect();
    const aspectRatio = cachedRect.width / cachedRect.height;