Skip to content

Commit

Permalink
feat: Reducing the agent chunk count (#637)
Browse files Browse the repository at this point in the history
  • Loading branch information
@patrickhousley
patrickhousley authored Aug 15, 2023
1 parent 5dca741 commit 043becf
Show file tree
Hide file tree
Showing 7 changed files with 308 additions and 117 deletions.
2 changes: 2 additions & 0 deletions src/features/session_replay/aggregate/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -173,12 +173,14 @@ export class Aggregate extends AggregateBase {
}

try {
// Do not change the webpackChunkName or it will break the webpack nrba-chunking plugin
recorder = (await import(/* webpackChunkName: "recorder" */'rrweb')).record
} catch (err) {
return this.abort()
}

try {
// Do not change the webpackChunkName or it will break the webpack nrba-chunking plugin
const { gzipSync, strToU8 } = await import(/* webpackChunkName: "compressor" */'fflate')
gzipper = gzipSync
u8 = strToU8
Expand Down
16 changes: 14 additions & 2 deletions tools/webpack/configs/common.mjs
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import webpack from 'webpack'
import TerserPlugin from 'terser-webpack-plugin'
import NRBAChunkingPlugin from '../plugins/nrba-chunking/index.mjs'

/**
* @typedef {import('../index.mjs').WebpackBuildOptions} WebpackBuildOptions
Expand All @@ -10,8 +11,9 @@ import TerserPlugin from 'terser-webpack-plugin'
* builds.
* @param {WebpackBuildOptions} env Build variables passed into the webpack cli
* using --env foo=bar --env biz=baz
* @param {string} asyncChunkName Partial name to use for the loader's async chunk
*/
export default (env) => {
export default (env, asyncChunkName) => {
return {
devtool: false,
mode: env.SUBVERSION === 'PROD' ? 'production' : 'development',
Expand All @@ -28,7 +30,14 @@ export default (env) => {
}
})],
flagIncludedChunks: true,
mergeDuplicateChunks: true
mergeDuplicateChunks: true,
splitChunks: {
chunks: 'async',
cacheGroups: {
defaultVendors: false,
default: false
}
}
},
output: {
filename: (pathData) => {
Expand All @@ -51,6 +60,9 @@ export default (env) => {
filename: '[file].map[query]',
moduleFilenameTemplate: 'nr-browser-agent://[namespace]/[resource-path]?[loaders]',
publicPath: env.PUBLIC_PATH
}),
new NRBAChunkingPlugin({
asyncChunkName
})
]
}
Expand Down
138 changes: 102 additions & 36 deletions tools/webpack/configs/polyfills.mjs
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import path from 'path'
import webpack from 'webpack'
import { merge } from 'webpack-merge'
import commonConfig from './common.mjs'
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
Expand All @@ -14,47 +15,112 @@ import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
* using --env foo=bar --env biz=baz
*/
export default (env) => {
return merge(commonConfig(env), {
target: 'browserslist:ie >= 11',
entry: {
'nr-loader-rum-polyfills': path.resolve(env.paths.src, 'cdn/polyfills/lite.js'),
'nr-loader-rum-polyfills.min': path.resolve(env.paths.src, 'cdn/polyfills/lite.js'),
'nr-loader-full-polyfills': path.resolve(env.paths.src, 'cdn/polyfills/pro.js'),
'nr-loader-full-polyfills.min': path.resolve(env.paths.src, 'cdn/polyfills/pro.js'),
'nr-loader-spa-polyfills': path.resolve(env.paths.src, 'cdn/polyfills/spa.js'),
'nr-loader-spa-polyfills.min': path.resolve(env.paths.src, 'cdn/polyfills/spa.js'),
'nr-polyfills.min': path.resolve(env.paths.src, 'cdn/polyfills.js')
const entryGroups = [
{
asyncChunkName: 'nr-rum-polyfills',
entry: {
'nr-loader-rum-polyfills': path.join(env.paths.src, 'cdn/polyfills/lite.js'),
'nr-loader-rum-polyfills.min': path.join(env.paths.src, 'cdn/polyfills/lite.js')
},
plugins: [
new webpack.IgnorePlugin({
checkResource: (resource, context) => {
if (context.match(/features\/utils/) && resource.indexOf('aggregate') > -1) {
// Only allow page_view_event, page_view_timing, and metrics features
return !resource.match(/page_view_event\/aggregate|page_view_timing\/aggregate|metrics\/aggregate/)
}

return false
}
})
]
},
output: {
chunkFilename: env.SUBVERSION === 'PROD' ? `[name].[chunkhash:8]-es5${env.PATH_VERSION}.min.js` : `[name]-es5${env.PATH_VERSION}.js`
{
asyncChunkName: 'nr-full-polyfills',
entry: {
'nr-loader-full-polyfills': path.join(env.paths.src, 'cdn/polyfills/pro.js'),
'nr-loader-full-polyfills.min': path.join(env.paths.src, 'cdn/polyfills/pro.js')
},
plugins: [
new webpack.IgnorePlugin({
checkResource: (resource, context) => {
if (context.match(/features\/utils/) && resource.indexOf('aggregate') > -1) {
// Allow all features except spa and session_replay
return resource.match(/spa\/aggregate|session_replay\/aggregate/)
}

return false
}
})
]
},
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules)/,
use: {
loader: 'babel-loader',
options: {
envName: 'webpack-ie11'
{
asyncChunkName: 'nr-spa-polyfills',
entry: {
'nr-loader-spa-polyfills': path.join(env.paths.src, 'cdn/polyfills/spa.js'),
'nr-loader-spa-polyfills.min': path.join(env.paths.src, 'cdn/polyfills/spa.js')
},
plugins: [
new webpack.IgnorePlugin({
checkResource: (resource, context) => {
if (context.match(/features\/utils/) && resource.indexOf('aggregate') > -1) {
// Do not allow session_replay feature
return resource.match(/session_replay\/aggregate/)
}

return false
}
}
})
]
},
plugins: [
new BundleAnalyzerPlugin({
analyzerMode: 'static',
openAnalyzer: false,
defaultSizes: 'stat',
reportFilename: `polyfills${env.PATH_VERSION}.stats.html`
}),
new BundleAnalyzerPlugin({
analyzerMode: 'json',
openAnalyzer: false,
defaultSizes: 'stat',
reportFilename: `polyfills${env.PATH_VERSION}.stats.json`
})
]
{
asyncChunkName: 'nr-polyfills',
entry: {
'nr-polyfills.min': path.resolve(env.paths.src, 'cdn/polyfills.js')
},
plugins: [
new webpack.optimize.LimitChunkCountPlugin({
maxChunks: 1
})
]
}
]

return entryGroups.map(entryGroup => {
return merge(commonConfig(env, entryGroup.asyncChunkName), {
target: 'browserslist:ie >= 11',
entry: entryGroup.entry,
output: {
chunkFilename: env.SUBVERSION === 'PROD' ? `[name].[chunkhash:8]-es5${env.PATH_VERSION}.min.js` : `[name]-es5${env.PATH_VERSION}.js`
},
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules)/,
use: {
loader: 'babel-loader',
options: {
envName: 'webpack-ie11'
}
}
}
]
},
plugins: [
new BundleAnalyzerPlugin({
analyzerMode: 'static',
openAnalyzer: false,
defaultSizes: 'stat',
reportFilename: `${entryGroup.asyncChunkName}${env.PATH_VERSION}.stats.html`
}),
new BundleAnalyzerPlugin({
analyzerMode: 'json',
openAnalyzer: false,
defaultSizes: 'stat',
reportFilename: `${entryGroup.asyncChunkName}${env.PATH_VERSION}.stats.json`
})
]
})
})
}
162 changes: 114 additions & 48 deletions tools/webpack/configs/standard.mjs
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import path from 'path'
import webpack from 'webpack'
import { merge } from 'webpack-merge'
import commonConfig from './common.mjs'
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
Expand All @@ -14,57 +15,122 @@ import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
* using --env foo=bar --env biz=baz
*/
export default (env) => {
return merge(commonConfig(env), {
target: 'web',
entry: {
'nr-loader-rum': path.join(env.paths.src, 'cdn/lite.js'),
'nr-loader-rum.min': path.join(env.paths.src, 'cdn/lite.js'),
'nr-loader-full': path.join(env.paths.src, 'cdn/pro.js'),
'nr-loader-full.min': path.join(env.paths.src, 'cdn/pro.js'),
'nr-loader-spa': path.join(env.paths.src, 'cdn/spa.js'),
'nr-loader-spa.min': path.join(env.paths.src, 'cdn/spa.js'),
...(env.SUBVERSION !== 'PROD' && { 'nr-loader-experimental': path.resolve(env.paths.src, 'cdn/experimental.js') }),
...(env.SUBVERSION !== 'PROD' && { 'nr-loader-experimental.min': path.resolve(env.paths.src, 'cdn/experimental.js') })
const entryGroups = [
{
asyncChunkName: 'nr-rum',
entry: {
'nr-loader-rum': path.join(env.paths.src, 'cdn/lite.js'),
'nr-loader-rum.min': path.join(env.paths.src, 'cdn/lite.js')
},
plugins: [
new webpack.IgnorePlugin({
checkResource: (resource, context) => {
if (context.match(/features\/utils/) && resource.indexOf('aggregate') > -1) {
// Only allow page_view_event, page_view_timing, and metrics features
return !resource.match(/page_view_event\/aggregate|page_view_timing\/aggregate|metrics\/aggregate/)
}

return false
}
})
]
},
{
asyncChunkName: 'nr-full',
entry: {
'nr-loader-full': path.join(env.paths.src, 'cdn/pro.js'),
'nr-loader-full.min': path.join(env.paths.src, 'cdn/pro.js')
},
plugins: [
new webpack.IgnorePlugin({
checkResource: (resource, context) => {
if (context.match(/features\/utils/) && resource.indexOf('aggregate') > -1) {
// Allow all features except spa and session_replay
return resource.match(/spa\/aggregate|session_replay\/aggregate/)
}

return false
}
})
]
},
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules)/,
use: (env.coverage || 'false').toLowerCase() === 'true'
? [
{ loader: './tools/webpack/loaders/istanbul/index.mjs' },
{
loader: 'babel-loader',
options: {
envName: 'webpack'
{
asyncChunkName: 'nr-spa',
entry: {
'nr-loader-spa': path.join(env.paths.src, 'cdn/spa.js'),
'nr-loader-spa.min': path.join(env.paths.src, 'cdn/spa.js')
},
plugins: [
new webpack.IgnorePlugin({
checkResource: (resource, context) => {
if (context.match(/features\/utils/) && resource.indexOf('aggregate') > -1) {
// Do not allow session_replay feature
return resource.match(/session_replay\/aggregate/)
}

return false
}
})
]
}
]

if (env.SUBVERSION !== 'PROD') {
entryGroups.push({
asyncChunkName: 'nr-experimental',
entry: {
'nr-loader-experimental': path.join(env.paths.src, 'cdn/experimental.js'),
'nr-loader-experimental.min': path.join(env.paths.src, 'cdn/experimental.js')
},
plugins: []
})
}

return entryGroups.map(entryGroup => {
return merge(commonConfig(env, entryGroup.asyncChunkName), {
target: 'web',
entry: entryGroup.entry,
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules)/,
use: (env.coverage || 'false').toLowerCase() === 'true'
? [
{ loader: './tools/webpack/loaders/istanbul/index.mjs' },
{
loader: 'babel-loader',
options: {
envName: 'webpack'
}
}
}
]
: [
{
loader: 'babel-loader',
options: {
envName: 'webpack'
]
: [
{
loader: 'babel-loader',
options: {
envName: 'webpack'
}
}
}
]
}
]
}
]
},
plugins: [
...entryGroup.plugins,
new BundleAnalyzerPlugin({
analyzerMode: 'static',
openAnalyzer: false,
defaultSizes: 'stat',
reportFilename: `${entryGroup.asyncChunkName}-standard${env.PATH_VERSION}.stats.html`
}),
new BundleAnalyzerPlugin({
analyzerMode: 'json',
openAnalyzer: false,
defaultSizes: 'stat',
reportFilename: `${entryGroup.asyncChunkName}-standard${env.PATH_VERSION}.stats.json`
})
]
},
plugins: [
new BundleAnalyzerPlugin({
analyzerMode: 'static',
openAnalyzer: false,
defaultSizes: 'stat',
reportFilename: `standard${env.PATH_VERSION}.stats.html`
}),
new BundleAnalyzerPlugin({
analyzerMode: 'json',
openAnalyzer: false,
defaultSizes: 'stat',
reportFilename: `standard${env.PATH_VERSION}.stats.json`
})
]
})
})
}
Loading

0 comments on commit 043becf

Please sign in to comment.