kmaraz

/**
 * Thank you very much @jh3141
 * @see https://github.com/webpack/webpack/issues/2031#issuecomment-317589620
 */
const excludeNodeModulesExcept = function (modules) {
  var pathSep = path.sep;
  if (pathSep == '\\')
    // must be quoted for use in a regexp:
    pathSep = '\\\\';
  var moduleRegExps = modules.map(function (modName) {

kmaraz

rules: [{
  test: /\.js$/,
  use: [babelLoader],
  exclude: excludeNodeModulesExcept([
    'debug', // <<<--- THIS IS IT FOLKS!
    // And many other libraries
    // '@angular',
    // '@ngrx',
    // 'something-in-es2018'
  ]),

kmaraz

const babelLoader = {
  loader: 'babel-loader',
  options: {
    // Don't waste time on Gzipping the cache
    cacheCompression: false,
    cacheDirectory: true,
    presets: [['@babel/env', { modules: false }]]
  },
};

kmaraz

const excludeNodeModulesExcept = function (modules) {
  var pathSep = path.sep;
  if (pathSep == '\\')
    // must be quoted for use in a regexp:
    pathSep = '\\\\';
  var moduleRegExps = modules.map(function (modName) {
    return new RegExp('node_modules' + pathSep + modName);
  });

  return function (modulePath) {

kmaraz

	Fast connection + Fast CPU	Fast connection + Slow CPU	Slow connection + Slow CPU
SW disabled	~3s	~7s	~10s
SW enabled	~2.6s	~5.9s	~7.4s
Decrease	13.33%	15.8%	26%

kmaraz

workbox.core.setCacheNameDetails({
  prefix: 'admin',
  suffix: 'v1',
  precache: 'precache',
  runtime: 'runtime'
});

// We force the new service worker to immediately take control of open pages
workbox.core.skipWaiting();
workbox.core.clientsClaim();

kmaraz

const webpack = require('webpack');
const path = require('path');
const pjson = require('./package.json');
const WorkboxPlugin = require('workbox-webpack-plugin');

// Package version should be good enough if we want
// to destinguish between new worker versions.
// Some will use only `sw.js`. That's completely fine.
const workerName = `sw-${pjson.version}}.js`;

kmaraz

this.WindowRef.adminWindow.channelInitialized = true;
if (this.WindowRef.adminWindow.cacheUpdates && this.WindowRef.adminWindow.cacheUpdates.length) {
  for (let i = 0; i < this.WindowRef.adminWindow.cacheUpdates.length; i++) {
    const { cacheName, updatedURL } = this.WindowRef.adminWindow.cacheUpdates[i];
    this.retrieveAndSendData(cacheName, updatedURL);
  }
  this.WindowRef.adminWindow.cacheUpdates = [];
}

kmaraz

window.cacheUpdates = [];
window.channelInitialized = false;

export const initializeWorker = function() {
  if ('BroadcastChannel' in window) {
    // Subscribe to broadcast channel from worker
    const apiUpdates = new BroadcastChannel(BROADCAST_CHANNEL);
    apiUpdates.addEventListener('message', (event: any) => {
      if (window.channelInitialized) {
        return;

kmaraz

async clearCache() {
  await caches.keys().then((cacheNames) => {
    cacheNames.forEach((cacheName) => {
      caches.delete(cacheName);
    });
  });
}