feat: Collect dynamicImports in plugins #217

nicholas-codecov · 2024-12-02T12:07:19Z

Description

This PR adds the functionality in the base plugins to capture the "dynamic imports". A dynamic import is when a given asset has code that lazily loads code when executed. The reason why we're adding in this functionality now, is that we need the dynamic imports to better inform the end user of what JS will be loaded initially and potentionally eventually on their given endpoint as a part of codecov/engineering-team#2570.

Closes codecov/engineering-team#3034

Notable Changes

Update Chunk type to include dynamicImports field which is of type string[]
Update rollup and vite plugins to grab dynamicImports and assign to chunks
Update webpack plugin to grab children array and assign the associated assets to the dynamicImports field
- Had to do a bit more work for the webpack as the children array is an array of chunks and not assets
Update some unit tests, integration test snapshot matchers, and snapshots

codecov · 2024-12-02T12:10:47Z

Codecov Report

Attention: Patch coverage is 79.41176% with 7 lines in your changes missing coverage. Please review.

Project coverage is 79.04%. Comparing base (20a677a) to head (01a321f).
Report is 1 commits behind head on main.

✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
...ndle-analysis/nextJSWebpackBundleAnalysisPlugin.ts	0.00%	2 Missing ⚠️
...c/vite-bundle-analysis/viteBundleAnalysisPlugin.ts	0.00%	2 Missing ⚠️
...ack-bundle-analysis/webpackBundleAnalysisPlugin.ts	0.00%	2 Missing ⚠️
...llup-bundle-analysis/rollupBundleAnalysisPlugin.ts	0.00%	1 Missing ⚠️

Additional details and impacted files

Components	Coverage Δ
Plugin core	`97.02% <100.00%> (ø)`
Rollup plugin	`10.76% <0.00%> (-0.05%)`	⬇️
Vite plugin	`10.93% <0.00%> (-0.09%)`	⬇️
Webpack plugin	`52.09% <92.85%> (+2.21%)`	⬆️

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

codecov-notifications · 2024-12-02T12:10:50Z

Codecov Report

Attention: Patch coverage is 79.41176% with 7 lines in your changes missing coverage. Please review.

✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
...ndle-analysis/nextJSWebpackBundleAnalysisPlugin.ts	0.00%	2 Missing ⚠️
...c/vite-bundle-analysis/viteBundleAnalysisPlugin.ts	0.00%	2 Missing ⚠️
...ack-bundle-analysis/webpackBundleAnalysisPlugin.ts	0.00%	2 Missing ⚠️
...llup-bundle-analysis/rollupBundleAnalysisPlugin.ts	0.00%	1 Missing ⚠️

Components	Coverage Δ
Plugin core	`97.02% <100.00%> (ø)`
Rollup plugin	`10.76% <0.00%> (-0.05%)`	⬇️
Vite plugin	`10.93% <0.00%> (-0.09%)`	⬇️
Webpack plugin	`52.09% <92.85%> (+2.21%)`	⬆️

📢 Thoughts on this report? Let us know!

codecov · 2024-12-02T12:16:09Z

Bundle Report

Changes will increase total bundle size by 1.12kB (0.02%) ⬆️. This is within the configured threshold ✅

Detailed changes

Bundle name	Size	Change
@codecov/vite-plugin-cjs	2.84kB	37 bytes (1.32%) ⬆️
@codecov/bundler-plugin-core-esm	12.32kB	30 bytes (0.24%) ⬆️
@codecov/rollup-plugin-cjs	2.85kB	37 bytes (1.31%) ⬆️
@codecov/nuxt-plugin-esm	1.23kB	397 bytes (47.83%) ⬆️
@codecov/webpack-plugin-cjs	4.7kB	236 bytes (5.28%) ⬆️
@codecov/webpack-plugin-esm	3.6kB	239 bytes (7.12%) ⬆️
@codecov/solidstart-plugin-esm	1.09kB	142 bytes (14.96%) ⬆️

codecov-staging · 2024-12-02T12:16:24Z

Bundle Report

Changes will decrease total bundle size by 41.44kB (-1.49%) ⬇️. This is within the configured threshold ✅

Detailed changes

Bundle name	Size	Change
@codecov/bundler-plugin-core-esm	12.32kB	40.83kB (-76.82%) ⬇️
@codecov/vite-plugin-cjs	2.84kB	37 bytes (1.32%) ⬆️
@codecov/vite-plugin-esm	1.24kB	1.09kB (-46.82%) ⬇️
@codecov/webpack-plugin-cjs	4.7kB	236 bytes (5.28%) ⬆️
@codecov/remix-vite-plugin-esm	1.09kB	133 bytes (13.9%) ⬆️
@codecov/webpack-plugin-esm	3.39kB	30 bytes (0.89%) ⬆️
@codecov/rollup-plugin-cjs	2.85kB	37 bytes (1.31%) ⬆️

suejung-sentry

Looks great!

packages/webpack-plugin/src/webpack-bundle-analysis/utils/processChunks.ts

suejung-sentry · 2024-12-02T22:24:03Z

packages/webpack-plugin/src/webpack-bundle-analysis/utils/processChunks.ts

@@ -7,19 +7,35 @@ export interface ProcessChunksArgs {

 export const processChunks = ({ chunks, chunkIdMap }: ProcessChunksArgs) => {


Oh that confused me - the chunkIdMap input is mutated below in this function. What do you think about adding a comment, or renaming it to like <result|output|mutated>ChunkIdMap or better yet, <result|output|mutated>UniqueIdsByChunkId?

I personally find it nice when just reading the function signature to know what the inputs, outputs, and side effects could be at a glance

I'm happy to add in a comment to provide more details.

suejung-sentry · 2024-12-02T22:33:16Z

packages/webpack-plugin/src/webpack-bundle-analysis/utils/processChunks.ts

    return {
      id: chunk.id?.toString() ?? "",
      uniqueId: uniqueId,
      entry: chunk.entry,
      initial: chunk.initial,
      files: chunk.files ?? [],
      names: chunk.names ?? [],
+      dynamicImports: dynamicImports,


Looks like this only goes 1 level deep for the chunk children. That seems right conceptually and simple - nice!

… snapshots

suejung-sentry approved these changes Dec 2, 2024

View reviewed changes

nicholas-codecov force-pushed the feat-collect-dynamic-imports-in-plugins branch from 782a812 to 3600d3e Compare December 3, 2024 14:05

nicholas-codecov added 8 commits December 4, 2024 13:12

add dynamicImports to the Chunk type

2966663

bump schema version to 3

966654c

collect dynamic imports from base bundler plugins

9544296

update plugin unit test snapshots

ef2bd5d

update integration tests to expect the dynamicImports array and their…

c47f7df

… snapshots

add chalk as a dev dep for the webpack plugin

5297a27

address feedback

6847293

rename arg and add in better comment

01a321f

nicholas-codecov force-pushed the feat-collect-dynamic-imports-in-plugins branch from 0ddd647 to 01a321f Compare December 4, 2024 17:14

nicholas-codecov merged commit 6f2bebc into main Dec 4, 2024
62 checks passed

nicholas-codecov deleted the feat-collect-dynamic-imports-in-plugins branch December 4, 2024 17:23

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: Collect dynamicImports in plugins #217

feat: Collect dynamicImports in plugins #217

nicholas-codecov commented Dec 2, 2024

codecov bot commented Dec 2, 2024 •

edited

Loading

codecov-notifications bot commented Dec 2, 2024 •

edited

Loading

codecov bot commented Dec 2, 2024 •

edited

Loading

codecov-staging bot commented Dec 2, 2024 •

edited

Loading

suejung-sentry left a comment

suejung-sentry Dec 2, 2024

nicholas-codecov Dec 3, 2024

suejung-sentry Dec 2, 2024

		@@ -7,19 +7,35 @@ export interface ProcessChunksArgs {

		export const processChunks = ({ chunks, chunkIdMap }: ProcessChunksArgs) => {

feat: Collect dynamicImports in plugins #217

feat: Collect dynamicImports in plugins #217

Conversation

nicholas-codecov commented Dec 2, 2024

Description

Notable Changes

codecov bot commented Dec 2, 2024 • edited Loading

Codecov Report

codecov-notifications bot commented Dec 2, 2024 • edited Loading

Codecov Report

codecov bot commented Dec 2, 2024 • edited Loading

Bundle Report

codecov-staging bot commented Dec 2, 2024 • edited Loading

Bundle Report

suejung-sentry left a comment

Choose a reason for hiding this comment

suejung-sentry Dec 2, 2024

Choose a reason for hiding this comment

nicholas-codecov Dec 3, 2024

Choose a reason for hiding this comment

suejung-sentry Dec 2, 2024

Choose a reason for hiding this comment

codecov bot commented Dec 2, 2024 •

edited

Loading

codecov-notifications bot commented Dec 2, 2024 •

edited

Loading

codecov bot commented Dec 2, 2024 •

edited

Loading

codecov-staging bot commented Dec 2, 2024 •

edited

Loading