angular / mobile-toolkit

Tools for building progressive web apps with Angular
MIT License
1.33k stars 176 forks source link

App loads all assets at initial loading (ngsw-cache-bust) #187

Open Halynsky opened 6 years ago

Halynsky commented 6 years ago

Problem:

After cleaning cookies (simulating first loading of app with ServiceWorkers) my app loads all files from assets in chain mode one after another. There is no such problem when I turn off service workers. debug

Versions:

    "@angular/core": "4.4.4",
    "@angular/service-worker": "^1.0.0-beta.16"

ngsw-manifest.json

{
  "routing": {
    "index": "/index.html",
    "routes": {
      "/": {
        "prefix": false
      }
    }
  },

  "dynamic": {
    "groups": [
      {
        "name": "static",
        "urls": {
          "/": {
            "match": "prefix"
          }
        },
        "cache": {
          "optimizerFor": "performance",
          "strategy": "fifo"
        }
      },
      {
        "name": "api",
        "urls": {
          "/api": {
            "match": "prefix"
          }
        },
        "cache": {
          "optimizerFor": "freshness",
          "networkTimeoutMs": "200",
          "maxAgeMs": "1000",
          "strategy": "fifo"
        }
      }
    ]
  }

}

Question:

Is it some bug or specific functionality of ServiceWorkers or some config problem? Can I turn it off?

playground commented 6 years ago

I'm having similar issue with Angular Cli "serviceWorker": true,

The build is including all static assets which are all being download on initial load. Is there a way to avoid them to be included in the build or some way to include only a subset similar to "match": "prefix" for static assets.

It's currently including everything

  "static": {
    "urls": {
      "/polyfills.bundle.js": "797380f10875ed6ec1950de6c3f8c1c5c039b1f7",
      "/main.bundle.js": "ad286daa32707291145b97cf1b9d127508888456",
      "/sw-register.bundle.js": "3f33aca6e4502d2f5000d2a43c8367e8c895f3c4",
      "/vendor.bundle.js": "9470978cdd2d8cc6138114a760e716fbb4433d5a",
      "/inline.bundle.js": "551f257a9460db66c8239aabf6ecea5704a068f4",
      "/styles.bundle.css": "f9d460956a9cbdaf2431874f06fa9bf1c4e65105",
      "/polyfills.bundle.js.map": "ffbd069844e94d8d91fd27ce05e5ad0637810df9",
      "/main.bundle.js.map": "ee24dd04b6ca1f9fa8b7787d0b7f7e969ace742e",
      "/styles.bundle.css.map": "4addd0788919e25bb33affc721727e421d378e34",
      "/sw-register.bundle.js.map": "2129c7403076b694f208955d13da8a95873137c6",
      "/vendor.bundle.js.map": "12f7cd7d01d0c41fe521f5f92ecf16f4c485a180",
      "/inline.bundle.js.map": "a7bc09ed5b04ea41472a1e01b5a11c33b04d7876",
      "/assets/fonts/iconfont/wx-iconfont-global/fonts/wx-iconfont-global.eot": "0ffe90b6eeb91a520ee709969bb11f35e4eca1b3",
      "/assets/fonts/iconfont/wx-iconfont-global/fonts/wx-iconfont-global.ttf": "4cdd03417d15a7a7a735624a239d980877780f33",
      "/assets/fonts/iconfont/wx-iconfont-global/fonts/wx-iconfont-global.woff": "d9d59e62f91616636afc0147cf1ee0073aa7a3e2",
      "/assets/fonts/iconfont/wx-iconfont-global/wx-iconfont-global.css": "de0c8914a6d1ee46d71e8e6e598a51805179ac6c",
      "/assets/fonts/iconfont/wx-iconfont-global/fonts/wx-iconfont-global.svg": "9baacbd7fc07b9249a7c0b9db7719a5fe76a52b7",
      "/assets/fonts/iconfont/wx-iconfont-global/wx-iconfont-global.scss": "cf9c19cf934e548a7060039ae7a5c7c62c94b27c",
       ...

I'm also struggling with applying service worker and other pwa features to an individual app in my multi apps cli project. I want to be able to provide unique ngsw-manifect.json for each app.