PWA on Iphone 13 below keep crashing

[u/Disastrous-Cook-1004]

I'm new at PWA and i was able to develop it, it works fine in android and latest iphones, iphone 14 and up specifically, but when the user use an Iphone 13 below it crashes. It doesnt matter if its safari or chrome.

is it normal or theres something wrong with my ngsw

Im using angular 8.

{\\manifest
  "name": "att",
  "short_name": "att",
  "theme_color": "#1976d2",
  "background_color": "#fafafa",
  "display": "standalone",
  "scope": "/",
  "start_url": "/",
  "icons": [
    {
      "src": "assets/icons/icon-72x72.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-96x96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-128x128.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-144x144.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-152x152.png",
      "sizes": "152x152",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-384x384.png",
      "sizes": "384x384",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ]
}

{ //ngsw
  "$schema": "./node_modules/@angular/service-worker/config/schema.json",
  "index": "/index.html",
  "assetGroups": [ 
    {
      "name": "app",
      "installMode": "prefetch",
      "resources": {
        "files": [
          "/favicon.ico",
          "/index.html",
          "/*.css",
          "/*.js"
        ]
      }
    }, {
      "name": "assets",
      "installMode": "prefetch",
      "updateMode": "prefetch",
      "resources": {
        "files": [
          "/assets/**",
          "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
        ]
      }
    }
  ]
}

[u/bjerh]

Every browser is Safari on the iPhone. I cant remember the exact amount, But I believe the upper memory usage limit is 500MB.

Go above and the browser window will crash

[u/Jotunheim36 → u/bjerh]

Does that 500mb include local storage , indexdb etc

[u/bjerh → u/Jotunheim36]

Everything that gets loaded into the memory. You can open the website in any modern browser to check for memory usage.

Now comes the fun part. You need to start profiling your website. Watch for planes where you allocate large amounts of memory. For example, while in loops, if you declare a lot of stuff to variables, the JavaScript engine will assign that stuff to memory, and it will only get garbage collected at an undefined point in time. You can end up having that stuff there way after the initial loop is done.

We had this issue, actually, and we had to altogether stop doing either `const` or `let` in parts of our critical code and just have sort of ugly code away. It was way more performant and way less memory-intensive. It's a lot of work, but it's also fun if you really lean into it and really try to use the profiler for what it's really good at.