webpack4中 splitchunks中的配置项 maxAsyncRequests搞不懂，有人实验过么

Question

最近在使用webpack4
在配置maxAsyncRequests 这一项的时候，试验了多次仍搞不懂是啥意思。我本来以为是异步中加载的最多chunk超过了就会合并? 代码如下：
entry: {

pageA: "./pageA", // 引用utility1.js  utility2.js    

},
optimization: {

splitChunks: {
  maxAsyncRequests: 3,
  cacheGroups: {
    default:false,
    commons: {
      chunks: "all",
      minChunks: 1,
      maxInitialRequests: 1, // The default limit is too small to showcase the effect
      maxAsyncRequests: 3,
      minSize: 0,// This is example is too small to create commons chunks,
      priority:2
    }
    
    
    
    \\PageA.js  
    import("./pageE").then(common => {
      console.log(common);
    })
    
 \\PageE.js
 var utility1 = require('./utility1');
 var utility2= require('./utility2');
 var utility3 = require('./utility3');
 
 
 本以为在pageE这个异步请求中可以有3个以内的并行请求，以为utility1-3可以单独分成3个包，结果是只有一个包？有哪位大神明白给讲解下

Answer 1

在webpack4里，splitChunks的maxAsyncRequests选项指的是”按需加载时的最大并行请求数“，我的理解跟浏览器在同一个域名下的最大并发请求数应该是相关的，以chrome浏览器为例，同域名下的最大并发请求数是6。webpack官方给的参考值是：maxAsyncRequests为5，maxInitialRequests为3。所以，用默认的就好，一般不用去配置。当然，要是maxAsyncRequests设为10，那可能就会出现意想不到的结果，我遇到过浏览器出现卡顿，点任何按钮都没反应的诡异情况！！！