Skip to content

Commit ec7d3e8

Browse files
wtgtybhertgeghgtwtgTheLarkInn
authored andcommitted
Updated SizeLimitsPlugin. (webpack#3688)
* Updated `SizeLimitsPlugin`. * Do requested changes.
1 parent e87f54f commit ec7d3e8

4 files changed

Lines changed: 130 additions & 158 deletions

File tree

lib/performance/AssetsOverSizeLimitWarning.js

Lines changed: 14 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -2,23 +2,18 @@
22
MIT License http://www.opensource.org/licenses/mit-license.php
33
Author Sean Larkin @thelarkinn
44
*/
5-
var SizeFormatHelpers = require("../SizeFormatHelpers");
5+
"use strict";
6+
const SizeFormatHelpers = require("../SizeFormatHelpers");
67

7-
function AssetsOverSizeLimitWarning(assetsOverSizeLimit, assetLimit) {
8-
Error.call(this);
9-
Error.captureStackTrace(this, AssetsOverSizeLimitWarning);
10-
this.name = "AssetsOverSizeLimitWarning";
11-
this.assets = assetsOverSizeLimit;
12-
13-
var assetLists = this.assets.map(function(asset) {
14-
return "\n " + asset.name + " (" + SizeFormatHelpers.formatSize(asset.size) + ")";
15-
}).join("");
16-
17-
this.message = "asset size limit: The following asset(s) exceed the recommended size limit (" + SizeFormatHelpers.formatSize(assetLimit) + "). \n" +
18-
"This can impact web performance.\n" +
19-
"Assets: " + assetLists;
20-
}
21-
module.exports = AssetsOverSizeLimitWarning;
22-
23-
AssetsOverSizeLimitWarning.prototype = Object.create(Error.prototype);
24-
AssetsOverSizeLimitWarning.prototype.constructor = AssetsOverSizeLimitWarning;
8+
module.exports = class AssetsOverSizeLimitWarning extends Error {
9+
constructor(assetsOverSizeLimit, assetLimit) {
10+
super();
11+
Error.captureStackTrace(this, this.constructor);
12+
this.name = "AssetsOverSizeLimitWarning";
13+
this.assets = assetsOverSizeLimit;
14+
const assetLists = this.assets.map(asset => `\n ${asset.name} (${SizeFormatHelpers.formatSize(asset.size)})`).join();
15+
this.message = `asset size limit: The following asset(s) exceed the recommended size limit (${SizeFormatHelpers.formatSize(assetLimit)}).
16+
This can impact web performance.
17+
Assets: ${assetLists}`;
18+
}
19+
};

lib/performance/EntrypointsOverSizeLimitWarning.js

Lines changed: 19 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -2,27 +2,23 @@
22
MIT License http://www.opensource.org/licenses/mit-license.php
33
Author Sean Larkin @thelarkinn
44
*/
5-
var SizeFormatHelpers = require("../SizeFormatHelpers");
5+
"use strict";
6+
const SizeFormatHelpers = require("../SizeFormatHelpers");
67

7-
function EntrypointsOverSizeLimitWarning(entrypoints, entrypointLimit) {
8-
Error.call(this);
9-
Error.captureStackTrace(this, EntrypointsOverSizeLimitWarning);
10-
this.name = "EntrypointsOverSizeLimitWarning";
11-
this.entrypoints = entrypoints;
12-
13-
var entrypointList = this.entrypoints.map(function(entrypoint) {
14-
return "\n " + entrypoint.name + " (" + SizeFormatHelpers.formatSize(entrypoint.size) + ")\n" +
15-
entrypoint.files
16-
.map(function(asset) {
17-
return " " + asset + "\n";
18-
}).join("");
19-
}).join("");
20-
21-
this.message = "entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (" + SizeFormatHelpers.formatSize(entrypointLimit) + "). " +
22-
"This can impact web performance.\n" +
23-
"Entrypoints:" + entrypointList;
24-
}
25-
module.exports = EntrypointsOverSizeLimitWarning;
26-
27-
EntrypointsOverSizeLimitWarning.prototype = Object.create(Error.prototype);
28-
EntrypointsOverSizeLimitWarning.prototype.constructor = EntrypointsOverSizeLimitWarning;
8+
module.exports = class EntrypointsOverSizeLimitWarning extends Error {
9+
constructor(entrypoints, entrypointLimit) {
10+
super();
11+
Error.captureStackTrace(this, this.constructor);
12+
this.name = "EntrypointsOverSizeLimitWarning";
13+
this.entrypoints = entrypoints;
14+
const entrypointList = this.entrypoints.map(entrypoint => `\n ${
15+
entrypoint.name
16+
} (${
17+
SizeFormatHelpers.formatSize(entrypoint.size)
18+
})\n${
19+
entrypoint.files.map(asset => ` ${asset}\n`).join()
20+
}`).join();
21+
this.message = `entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (${SizeFormatHelpers.formatSize(entrypointLimit)}). This can impact web performance.
22+
Entrypoints:${entrypointList}`;
23+
}
24+
};

lib/performance/NoAsyncChunksWarning.js

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,15 @@
22
MIT License http://www.opensource.org/licenses/mit-license.php
33
Author Sean Larkin @thelarkinn
44
*/
5-
function NoAsyncChunksWarning() {
6-
Error.call(this);
7-
Error.captureStackTrace(this, NoAsyncChunksWarning);
8-
this.name = "NoAsyncChunksWarning";
5+
"use strict";
96

10-
this.message = "webpack performance recommendations: \n" +
11-
"You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.\n" +
12-
"For more info visit https://webpack.js.org/guides/code-splitting/";
13-
}
14-
module.exports = NoAsyncChunksWarning;
15-
16-
NoAsyncChunksWarning.prototype = Object.create(Error.prototype);
17-
NoAsyncChunksWarning.prototype.constructor = NoAsyncChunksWarning;
7+
module.exports = class NoAsyncChunksWarning extends Error {
8+
constructor() {
9+
super();
10+
Error.captureStackTrace(this, this.constructor);
11+
this.name = "NoAsyncChunksWarning";
12+
this.message = "webpack performance recommendations: \n" +
13+
"You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.\n" +
14+
"For more info visit https://webpack.js.org/guides/code-splitting/";
15+
}
16+
};

lib/performance/SizeLimitsPlugin.js

Lines changed: 86 additions & 104 deletions
Original file line numberDiff line numberDiff line change
@@ -2,119 +2,101 @@
22
MIT License http://www.opensource.org/licenses/mit-license.php
33
Author Sean Larkin @thelarkinn
44
*/
5-
var EntrypointsOverSizeLimitWarning = require("./EntrypointsOverSizeLimitWarning");
6-
var AssetsOverSizeLimitWarning = require("./AssetsOverSizeLimitWarning");
7-
var NoAsyncChunksWarning = require("./NoAsyncChunksWarning");
8-
9-
function SizeLimitsPlugin(options) {
10-
this.hints = options.hints;
11-
this.maxAssetSize = options.maxAssetSize;
12-
this.maxEntrypointSize = options.maxEntrypointSize;
13-
this.assetFilter = options.assetFilter;
14-
}
15-
16-
module.exports = SizeLimitsPlugin;
17-
18-
SizeLimitsPlugin.prototype.apply = function(compiler) {
19-
var entrypointSizeLimit = this.maxEntrypointSize;
20-
var assetSizeLimit = this.maxAssetSize;
21-
var hints = this.hints;
22-
var assetFilter = this.assetFilter || function(asset) {
23-
return !(/\.map$/.test(asset))
24-
};
25-
26-
compiler.plugin("after-emit", function(compilation, callback) {
27-
var warnings = [];
28-
29-
var getEntrypointSize = function(entrypoint) {
30-
var files = entrypoint.getFiles();
31-
32-
return files
5+
"use strict";
6+
const EntrypointsOverSizeLimitWarning = require("./EntrypointsOverSizeLimitWarning");
7+
const AssetsOverSizeLimitWarning = require("./AssetsOverSizeLimitWarning");
8+
const NoAsyncChunksWarning = require("./NoAsyncChunksWarning");
9+
10+
module.exports = class SizeLimitsPlugin {
11+
constructor(options) {
12+
this.hints = options.hints;
13+
this.maxAssetSize = options.maxAssetSize;
14+
this.maxEntrypointSize = options.maxEntrypointSize;
15+
this.assetFilter = options.assetFilter;
16+
}
17+
apply(compiler) {
18+
const entrypointSizeLimit = this.maxEntrypointSize;
19+
const assetSizeLimit = this.maxAssetSize;
20+
const hints = this.hints;
21+
const assetFilter = this.assetFilter || (asset => !(/\.map$/.test(asset)));
22+
23+
compiler.plugin("after-emit", (compilation, callback) => {
24+
const warnings = [];
25+
26+
const getEntrypointSize = entrypoint =>
27+
entrypoint.getFiles()
3328
.filter(assetFilter)
34-
.map(function(file) {
35-
return compilation.assets[file];
36-
})
29+
.map(file => compilation.assets[file])
3730
.filter(Boolean)
38-
.map(function(asset) {
39-
return asset.size()
40-
})
41-
.reduce(function(currentSize, nextSize) {
42-
return currentSize + nextSize
43-
}, 0);
44-
};
31+
.map(asset => asset.size())
32+
.reduce((currentSize, nextSize) => currentSize + nextSize, 0);
4533

46-
var assetsOverSizeLimit = [];
47-
Object.keys(compilation.assets)
48-
.filter(assetFilter)
49-
.forEach(function(assetName) {
50-
var asset = compilation.assets[assetName];
51-
var size = asset.size();
52-
53-
if(size > assetSizeLimit) {
54-
assetsOverSizeLimit.push({
55-
name: assetName,
56-
size: size
57-
});
58-
asset.isOverSizeLimit = true;
34+
const assetsOverSizeLimit = [];
35+
Object.keys(compilation.assets)
36+
.filter(assetFilter)
37+
.forEach(assetName => {
38+
const asset = compilation.assets[assetName];
39+
const size = asset.size();
40+
41+
if(size > assetSizeLimit) {
42+
assetsOverSizeLimit.push({
43+
name: assetName,
44+
size: size,
45+
});
46+
asset.isOverSizeLimit = true;
47+
}
48+
});
49+
50+
const entrypointsOverLimit = [];
51+
Object.keys(compilation.entrypoints)
52+
.forEach(key => {
53+
const entry = compilation.entrypoints[key];
54+
const size = getEntrypointSize(entry, compilation);
55+
56+
if(size > entrypointSizeLimit) {
57+
entrypointsOverLimit.push({
58+
name: key,
59+
size: size,
60+
files: entry.getFiles().filter(assetFilter)
61+
});
62+
entry.isOverSizeLimit = true;
63+
}
64+
});
65+
66+
if(hints) {
67+
// 1. Individual Chunk: Size < 250kb
68+
// 2. Collective Initial Chunks [entrypoint] (Each Set?): Size < 250kb
69+
// 3. No Async Chunks
70+
// if !1, then 2, if !2 return
71+
if(assetsOverSizeLimit.length > 0) {
72+
warnings.push(
73+
new AssetsOverSizeLimitWarning(
74+
assetsOverSizeLimit,
75+
assetSizeLimit));
5976
}
60-
});
61-
62-
var entrypointsOverLimit = [];
63-
Object.keys(compilation.entrypoints)
64-
.forEach(function(key) {
65-
var entry = compilation.entrypoints[key];
66-
var size = getEntrypointSize(entry, compilation);
67-
68-
if(size > entrypointSizeLimit) {
69-
entrypointsOverLimit.push({
70-
name: key,
71-
size: size,
72-
files: entry.getFiles().filter(assetFilter)
73-
});
74-
entry.isOverSizeLimit = true;
77+
if(entrypointsOverLimit.length > 0) {
78+
warnings.push(
79+
new EntrypointsOverSizeLimitWarning(
80+
entrypointsOverLimit,
81+
entrypointSizeLimit));
7582
}
76-
});
7783

78-
if(hints) {
79-
// 1. Individual Chunk: Size < 250kb
80-
// 2. Collective Initial Chunks [entrypoint] (Each Set?): Size < 250kb
81-
// 3. No Async Chunks
82-
// if !1, then 2, if !2 return
83-
if(assetsOverSizeLimit.length > 0) {
84-
warnings.push(
85-
new AssetsOverSizeLimitWarning(
86-
assetsOverSizeLimit,
87-
assetSizeLimit
88-
)
89-
);
90-
}
91-
if(entrypointsOverLimit.length > 0) {
92-
warnings.push(
93-
new EntrypointsOverSizeLimitWarning(
94-
entrypointsOverLimit,
95-
entrypointSizeLimit
96-
)
97-
);
98-
}
84+
if(warnings.length > 0) {
85+
const hasAsyncChunks = compilation.chunks.filter(chunk => !chunk.isInitial()).length > 0;
9986

100-
if(warnings.length > 0) {
101-
var hasAsyncChunks = compilation.chunks.filter(function(chunk) {
102-
return !chunk.isInitial();
103-
}).length > 0;
87+
if(!hasAsyncChunks) {
88+
warnings.push(new NoAsyncChunksWarning());
89+
}
10490

105-
if(!hasAsyncChunks) {
106-
warnings.push(new NoAsyncChunksWarning());
107-
}
108-
109-
if(hints === "error") {
110-
Array.prototype.push.apply(compilation.errors, warnings);
111-
} else {
112-
Array.prototype.push.apply(compilation.warnings, warnings);
91+
if(hints === "error") {
92+
Array.prototype.push.apply(compilation.errors, warnings);
93+
} else {
94+
Array.prototype.push.apply(compilation.warnings, warnings);
95+
}
11396
}
11497
}
115-
}
116-
117-
callback();
118-
});
11998

99+
callback();
100+
});
101+
}
120102
};

0 commit comments

Comments
 (0)