Skip to content

Commit

Permalink
Add @next/bundle-analyzer (#929)
Browse files Browse the repository at this point in the history
  • Loading branch information
majakomel committed Apr 16, 2024
1 parent c3872ef commit 3011499
Show file tree
Hide file tree
Showing 4 changed files with 1,782 additions and 1,710 deletions.
251 changes: 134 additions & 117 deletions next.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,9 @@ const glob = require('glob')
const { dirname, basename, resolve } = require('path')
const { execSync } = require('child_process')

const withBundleAnalyzer = require('@next/bundle-analyzer')({
enabled: process.env.ANALYZE === 'true',
})

const LANG_DIR = './public/static/lang/'
const DEFAULT_LOCALE = 'en'
Expand All @@ -20,126 +23,140 @@ function getSupportedLanguages() {
return [...supportedLanguages]
}

module.exports = withSentryConfig(
{
output: 'standalone',
async redirects() {
return [
{
source: '/experimental/mat',
destination: '/chart/mat',
permanent: true,
},
]
},
compiler: {
// see https://styled-components.com/docs/tooling#babel-plugin for more info on the options.
styledComponents: {
ssr: true,
module.exports = withBundleAnalyzer(
withSentryConfig(
{
output: 'standalone',
async redirects() {
return [
{
source: '/experimental/mat',
destination: '/chart/mat',
permanent: true,
},
]
},
},
i18n: {
locales: getSupportedLanguages(),
defaultLocale: DEFAULT_LOCALE,
},
webpack: (config, options) => {
const gitCommitSHAShort = process.env.RUN_GIT_COMMIT_SHA_SHORT ? execSync(process.env.RUN_GIT_COMMIT_SHA_SHORT) : ''
const gitCommitSHA = process.env.RUN_GIT_COMMIT_SHA ? execSync(process.env.RUN_GIT_COMMIT_SHA) : ''
const gitCommitRef = process.env.RUN_GIT_COMMIT_REF ? execSync(process.env.RUN_GIT_COMMIT_REF) : ''
const gitCommitTags = process.env.RUN_GIT_COMMIT_TAGS ? execSync(process.env.RUN_GIT_COMMIT_TAGS) : ''

config.plugins.push(
new options.webpack.DefinePlugin({
'process.env.GIT_COMMIT_SHA_SHORT': JSON.stringify(
gitCommitSHAShort.toString()
),
'process.env.GIT_COMMIT_SHA': JSON.stringify(gitCommitSHA.toString()),
'process.env.GIT_COMMIT_REF': JSON.stringify(gitCommitRef.toString()),
'process.env.GIT_COMMIT_TAGS': JSON.stringify(
gitCommitTags.toString()
),
'process.env.DEFAULT_LOCALE': DEFAULT_LOCALE,
'process.env.LOCALES': JSON.stringify(getSupportedLanguages()),
'process.env.WDYR': JSON.stringify(process.env.WDYR),
})
)

// SVG
// Grab the existing rule that handles SVG imports
const fileLoaderRule = config.module.rules.find((rule) =>
rule.test?.test?.('.svg'),
)

config.module.rules.push(
// Convert all *.svg imports to React components
{
test: /\.svg$/i,
issuer: /\.[jt]sx?$/,
use: ['@svgr/webpack'],
compiler: {
// see https://styled-components.com/docs/tooling#babel-plugin for more info on the options.
styledComponents: {
ssr: true,
},
)

// Modify the file loader rule to ignore *.svg, since we have it handled
fileLoaderRule.exclude = /\.svg$/i

// whyDidYouRender
if (options.dev && !options.isServer) {
const originalEntry = config.entry
config.entry = async () => {
const wdrPath = resolve(__dirname, './scripts/wdyr.js')
const entries = await originalEntry()
if (entries['main.js'] && !entries['main.js'].includes(wdrPath)) {
entries['main.js'].unshift(wdrPath)
},
i18n: {
locales: getSupportedLanguages(),
defaultLocale: DEFAULT_LOCALE,
},
webpack: (config, options) => {
const gitCommitSHAShort = process.env.RUN_GIT_COMMIT_SHA_SHORT
? execSync(process.env.RUN_GIT_COMMIT_SHA_SHORT)
: ''
const gitCommitSHA = process.env.RUN_GIT_COMMIT_SHA
? execSync(process.env.RUN_GIT_COMMIT_SHA)
: ''
const gitCommitRef = process.env.RUN_GIT_COMMIT_REF
? execSync(process.env.RUN_GIT_COMMIT_REF)
: ''
const gitCommitTags = process.env.RUN_GIT_COMMIT_TAGS
? execSync(process.env.RUN_GIT_COMMIT_TAGS)
: ''

config.plugins.push(
new options.webpack.DefinePlugin({
'process.env.GIT_COMMIT_SHA_SHORT': JSON.stringify(
gitCommitSHAShort.toString(),
),
'process.env.GIT_COMMIT_SHA': JSON.stringify(
gitCommitSHA.toString(),
),
'process.env.GIT_COMMIT_REF': JSON.stringify(
gitCommitRef.toString(),
),
'process.env.GIT_COMMIT_TAGS': JSON.stringify(
gitCommitTags.toString(),
),
'process.env.DEFAULT_LOCALE': DEFAULT_LOCALE,
'process.env.LOCALES': JSON.stringify(getSupportedLanguages()),
'process.env.WDYR': JSON.stringify(process.env.WDYR),
}),
)

// SVG
// Grab the existing rule that handles SVG imports
const fileLoaderRule = config.module.rules.find((rule) =>
rule.test?.test?.('.svg'),
)

config.module.rules.push(
// Convert all *.svg imports to React components
{
test: /\.svg$/i,
issuer: /\.[jt]sx?$/,
use: ['@svgr/webpack'],
},
)

// Modify the file loader rule to ignore *.svg, since we have it handled
fileLoaderRule.exclude = /\.svg$/i

// whyDidYouRender
if (options.dev && !options.isServer) {
const originalEntry = config.entry
config.entry = async () => {
const wdrPath = resolve(__dirname, './scripts/wdyr.js')
const entries = await originalEntry()
if (entries['main.js'] && !entries['main.js'].includes(wdrPath)) {
entries['main.js'].unshift(wdrPath)
}
return entries
}
return entries
}
}

if (!options.isServer) {
config.resolve.fallback = {
...config.resolve.fallback,
fs: false,

if (!options.isServer) {
config.resolve.fallback = {
...config.resolve.fallback,
fs: false,
}
}
}

return config

return config
},
productionBrowserSourceMaps: true,
},
{
// For all available options, see:
// https://github.com/getsentry/sentry-webpack-plugin#options
debug: process.env.NODE_ENV === 'development',
dryRun: process.env.NODE_ENV === 'development',
release: process.env.GIT_COMMIT_SHA,
// Suppresses source map uploading logs during build
silent: true,
org: 'ooni',
project: 'explorer',
},
{
// For all available options, see:
// https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/

// Upload a larger set of source maps for prettier stack traces (increases build time)
widenClientFileUpload: true,

// Transpiles SDK to be compatible with IE11 (increases bundle size)
transpileClientSDK: true,

// Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load)
tunnelRoute: '/monitoring',

// Hides source maps from generated client bundles
hideSourceMaps: true,

// Automatically tree-shake Sentry logger statements to reduce bundle size
disableLogger: true,

// Enables automatic instrumentation of Vercel Cron Monitors.
// See the following for more information:
// https://docs.sentry.io/product/crons/
// https://vercel.com/docs/cron-jobs
automaticVercelMonitors: true,
},
productionBrowserSourceMaps: true,
},
{
// For all available options, see:
// https://github.com/getsentry/sentry-webpack-plugin#options
debug: process.env.NODE_ENV === 'development',
dryRun: process.env.NODE_ENV === 'development',
release: process.env.GIT_COMMIT_SHA,
// Suppresses source map uploading logs during build
silent: true,
org: "ooni",
project: "explorer",
},
{
// For all available options, see:
// https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/

// Upload a larger set of source maps for prettier stack traces (increases build time)
widenClientFileUpload: true,

// Transpiles SDK to be compatible with IE11 (increases bundle size)
transpileClientSDK: true,

// Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load)
tunnelRoute: "/monitoring",

// Hides source maps from generated client bundles
hideSourceMaps: true,

// Automatically tree-shake Sentry logger statements to reduce bundle size
disableLogger: true,

// Enables automatic instrumentation of Vercel Cron Monitors.
// See the following for more information:
// https://docs.sentry.io/product/crons/
// https://vercel.com/docs/cron-jobs
automaticVercelMonitors: true,
}
);
),
)
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,7 @@
"jackspeak": "2.1.1"
},
"devDependencies": {
"@next/bundle-analyzer": "^14.2.1",
"@svgr/webpack": "^8.1.0",
"@testing-library/cypress": "^10.0.1",
"@welldone-software/why-did-you-render": "^8.0.1",
Expand Down
19 changes: 8 additions & 11 deletions public/mockServiceWorker.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,14 @@
/* tslint:disable */

/**
* Mock Service Worker (2.1.0).
* Mock Service Worker.
* @see https://github.com/mswjs/msw
* - Please do NOT modify this file.
* - Please do NOT serve this file on production.
*/

const INTEGRITY_CHECKSUM = '223d191a56023cd36aa88c802961b911'
const PACKAGE_VERSION = '2.2.13'
const INTEGRITY_CHECKSUM = '26357c79639bfa20d64c0efca2a87423'
const IS_MOCKED_RESPONSE = Symbol('isMockedResponse')
const activeClientIds = new Set()

Expand Down Expand Up @@ -48,7 +49,10 @@ self.addEventListener('message', async function (event) {
case 'INTEGRITY_CHECK_REQUEST': {
sendToClient(client, {
type: 'INTEGRITY_CHECK_RESPONSE',
payload: INTEGRITY_CHECKSUM,
payload: {
packageVersion: PACKAGE_VERSION,
checksum: INTEGRITY_CHECKSUM,
},
})
break
}
Expand Down Expand Up @@ -202,13 +206,6 @@ async function getResponse(event, client, requestId) {
return passthrough()
}

// Bypass requests with the explicit bypass header.
// Such requests can be issued by "ctx.fetch()".
const mswIntention = request.headers.get('x-msw-intention')
if (['bypass', 'passthrough'].includes(mswIntention)) {
return passthrough()
}

// Notify the client that a request has been intercepted.
const requestBuffer = await request.arrayBuffer()
const clientMessage = await sendToClient(
Expand Down Expand Up @@ -240,7 +237,7 @@ async function getResponse(event, client, requestId) {
return respondWithMock(clientMessage.data)
}

case 'MOCK_NOT_FOUND': {
case 'PASSTHROUGH': {
return passthrough()
}
}
Expand Down
Loading

0 comments on commit 3011499

Please sign in to comment.