chore(webpack): first pass on better webpack build #7038

evenstensberg · 2023-09-06T15:40:56Z

Describe your changes:

This PR covers the initial work on a better configuration for the openMCT application. It's a restructural change to the existing configurations along with some improvements in the build itself.

All Submissions:

Have you followed the guidelines in our Contributing document?
Have you checked to ensure there aren't other open Pull Requests for the same update/change?
Is this change backwards compatible? For example, developers won't need to change how they are calling the API or how they've extended core plugins such as Tables or Plots.

Author Checklist

Changes address original issue?
Tests included and/or updated with changes?
Command line build passes?
Has this been smoke tested?
Testing instructions included in associated issue OR is this a dependency/testcase change?

Reviewer Checklist

Changes appear to address issue?
Reviewer has tested changes by following the provided instructions?
Changes appear not to be breaking changes?
Appropriate automated tests included?
Code style and in-line documentation are appropriate?
Has associated issue been labelled unverified? (only applicable if this PR closes the issue)
Has associated issue been labelled bug? (only applicable if this PR is for a bug fix)

evenstensberg · 2023-09-06T15:41:41Z

@unlikelyzero test this thoroughly with both production and development builds. Have tested it with devServer but you need to make sure it doesnt break anything on your end.

deploysentinel · 2023-09-06T15:45:39Z

Current Playwright Test Results Summary

✅ 162 Passing - ⚠️ 2 Flaky

Run may still be in progress, this comment will be updated as current testing workflow or job completes...

(Last updated on 12/09/2023 03:33:10pm UTC)

Run Details

Running Job e2e-stable on CircleCI

Commit: 6b679d7

Started: 12/09/2023 03:27:04pm UTC

⚠️ Flakes

📄 functional/plugins/notebook/restrictedNotebook.e2e.spec.js • 2 Flakes

Top 1 Common Error Messages

`null`	2 Test Cases Affected

Test Case Results

Test Case	Last 7 days Failures	Last 7 days Flakes
Restricted Notebook with a page locked and with an embed @addinit Allows embeds to be deleted if page unlocked @addinit Retry 1 • Initial Attempt	0% (0) 0 / 39 runs failed over last 7 days	56.41% (22) 22 / 39 runs flaked over last 7 days
Restricted Notebook with a page locked and with an embed @addinit Disallows embeds to be deleted if page locked @addinit Retry 1 • Initial Attempt	2.56% (1) 1 / 39 run failed over last 7 days	41.03% (16) 16 / 39 runs flaked over last 7 days

View Detailed Build Results

codecov · 2023-09-06T15:48:33Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 55.98%. Comparing base (28bfc90) to head (6b679d7).
Report is 217 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #7038      +/-   ##
==========================================
- Coverage   56.07%   55.98%   -0.10%     
==========================================
  Files         654      655       +1     
  Lines       26228    26251      +23     
  Branches     2528     2528              
==========================================
- Hits        14707    14696      -11     
- Misses      10825    10852      +27     
- Partials      696      703       +7

Flag	Coverage Δ		*Carryforward flag
e2e-full	`41.87% <ø> (-0.06%)`	⬇️	Carriedforward from 1e9f055
e2e-stable	`58.25% <ø> (-0.09%)`	⬇️
unit	`49.29% <ø> (-0.09%)`	⬇️

*This pull request uses carry forward flags. Click here to find out more.

Files with missing lines	Coverage Δ
src/utils/testing.js	`76.41% <ø> (ø)`

... and 13 files with indirect coverage changes

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 28bfc90...6b679d7. Read the comment docs.

unlikelyzero · 2023-09-06T16:02:18Z

@evenstensberg hey this is great! Before we dive into the structure of it, can you spend one or two cycles figuring out why the tests are failing?

evenstensberg · 2023-09-07T12:48:17Z

@unlikelyzero ok now? PTAL

evenstensberg · 2023-09-08T21:21:50Z

@unlikelyzero what do you think of a dev setup with prod + dev builds that runs openmct locally (with unique bundles and chunks), and for customers, you'll have an unique build that only generates one bundle (dependency following your grammar) per entry?

ozyx · 2023-09-11T16:33:58Z

@evenstensberg If I run build:dev and do npm start, I get an infinite spinner. Seems only the prod build is functional at this point?

ozyx

Looking good so far! I've just left a couple questions for you.

BTW, I converted the original issue linked to this PR to a discussion as it seemed to fit better on the discussion board. Could you please create a new issue identifying the enhancements needed for our webpack config and then link it to this PR? Please then update the PR description with details about your implementation.

.webpack/webpack.dev.js

.webpack/webpack.prod.js

evenstensberg · 2023-09-13T18:23:13Z

@evenstensberg If I run build:dev and do npm start, I get an infinite spinner. Seems only the prod build is functional at this point?

I'll have a look. I enabled progress bar (progressplugin) for dev, so you can see progress. For prod I didn't use it so you save a bit on ci logging $$$

evenstensberg · 2023-09-14T19:15:50Z

@evenstensberg If I run build:dev and do npm start, I get an infinite spinner. Seems only the prod build is functional at this point?

Have reproduced this, and is because we don't generate a css file in dev anymore. I'll check if there's a workaround without using miniextractcss in dev builds.

evenstensberg · 2023-09-14T19:28:00Z

@ozyx Added a temp workaround. Suggestions to your build below (you need to discuss this with the team).

We can have your own configuration file that bundles css, but it doesn't differ when you do this in dev/prod builds
(Optimal) You can use gulp to generate your global css files (themes).

In one of my previous projects, we bundled all global stylesheets with gulp so that the webpack build step is somewhat isolated from generating your global stylesheets or dependencies.

ozyx · 2023-09-22T16:45:14Z

@evenstensberg Sorry for the delay in reviewing this, we've been busy wrapping up a release. I'm going to take a look at this today. Thanks for your patience!

ozyx · 2023-09-26T20:23:22Z

(Optimal) You can use gulp to generate your global css files (themes).

Hmm. I rather like the idea of keeping this modular. Let me discuss this with the team.

evenstensberg

@ozyx want me to rebase?

ozyx · 2023-10-15T16:20:09Z

@ozyx want me to rebase?

That'd be great!

evenstensberg · 2023-10-15T19:23:12Z

@ozyx PTAL

unlikelyzero

Please remove any detection of the NODE_ENV variable

.webpack/webpack.base.js

.webpack/webpack.prod.js

.webpack/webpack.base.js

ozyx

Looking good. Still need to do some cursory testing-- just a couple of changes requested for now

.webpack/webpack.dev.js

evenstensberg · 2023-10-26T16:53:41Z

ptal @ozyx

ozyx

Please address the test failures

evenstensberg · 2023-11-17T13:20:44Z

PTAL @ozyx

ozyx

We're getting closer. I left some comments regarding the minimization options that were chosen here. The goal is to get the bundle size as small as possible with as least aggressive minimization options as possible.

.webpack/webpack.prod.js

src/plugins/URLIndicatorPlugin/URLIndicatorSpec.js

ozyx · 2023-11-21T22:53:56Z

.webpack/webpack.prod.js

+          warnings: false,
+          parse: {
+            html5_comments: false
+          },
+          mangle: true,
+          module: false,
+          toplevel: false,
+          nameCache: null,
+          ie8: false,
+          keep_classnames: false,
+          keep_fnames: false,
+          safari10: false


We need to be very careful here as we see more e2e test flakes and odd behavior with some of these options.

What's the least aggressive we can be with minimization optimization while also shrinking the bundle size as much as possible? In my experiments I found we should be able to shrink openmct.js from ~35MB to ~5MB. If we can get close to that with mostly default settings, we should opt for that.

I think that you'll need to manually test each of these settings, and enable/disable yourself to customize the fine-grained optimizations to your build.

evenstensberg · 2023-11-22T19:14:44Z

@ozyx PTAL. left a comment on the remaining optimization strategies.

Use the default options provided by terser

evenstensberg · 2023-12-09T15:25:10Z

@ozyx I removed the options in the terser plugin. Just use defaults for now. PTAL

unlikelyzero · 2023-12-11T22:22:20Z

.webpack/webpack.prod.js

+          },
+          {
+            loader: 'sass-loader',
+            // resolve-url-loader needs all loaders below its decl to have sourcemaps enabled


unlikelyzero

Thanks for the updates. Will defer to @ozyx for remaining scope

evenstensberg added 4 commits September 6, 2023 13:40

chore: wip

d04d575

chore: wip

f5efdc5

chore: wip

ee41585

chore: wip

e6b752a

evenstensberg closed this Sep 6, 2023

evenstensberg reopened this Sep 6, 2023

evenstensberg added 3 commits September 6, 2023 19:14

chore: remove old reference

d85246d

Merge branch 'master' into feat/webpack

7fec46f

chore: wip

ff93e51

unlikelyzero added the source:community Community contribution or request label Sep 11, 2023

ozyx suggested changes Sep 11, 2023

View reviewed changes

.webpack/webpack.dev.js Show resolved Hide resolved

.webpack/webpack.dev.js Outdated Show resolved Hide resolved

.webpack/webpack.prod.js Outdated Show resolved Hide resolved

fix: css generation

fed625e

evenstensberg requested a review from ozyx September 17, 2023 18:36

evenstensberg commented Oct 14, 2023

View reviewed changes

chore: rebase

a7cbedc

unlikelyzero requested changes Oct 15, 2023

View reviewed changes

.webpack/webpack.base.js Outdated Show resolved Hide resolved

.webpack/webpack.base.js Outdated Show resolved Hide resolved

.webpack/webpack.prod.js Outdated Show resolved Hide resolved

evenstensberg commented Oct 20, 2023

View reviewed changes

.webpack/webpack.base.js Show resolved Hide resolved

fix: proper devserver config

c8016e3

ozyx suggested changes Oct 20, 2023

View reviewed changes

.webpack/webpack.dev.js Outdated Show resolved Hide resolved

.webpack/webpack.dev.js Show resolved Hide resolved

evenstensberg added 2 commits October 20, 2023 22:04

chore: brainfart

a489178

chore: keep old props

9537110

evenstensberg requested a review from ozyx October 21, 2023 09:37

evenstensberg added 3 commits October 21, 2023 17:49

Merge branch 'master' into feat/webpack

990576b

Merge branch 'master' into feat/webpack

4f6ba74

Merge branch 'master' into feat/webpack

b76d566

Merge branch 'master' into feat/webpack

2974e47

ozyx suggested changes Nov 2, 2023

View reviewed changes

evenstensberg added 3 commits November 3, 2023 21:26

Merge branch 'master' into feat/webpack

9c3acfa

Merge branch 'master' into feat/webpack

bfd61d5

fix: clock reset

2b230d8

This comment was marked as outdated.

Sign in to view

evenstensberg added 3 commits November 17, 2023 12:51

Merge branch 'master' into feat/webpack

82f2dc6

chore: wip

ef67729

fix: outputpath

2277346

evenstensberg mentioned this pull request Nov 18, 2023

Reduce bundle size #7246

Merged

15 tasks

Merge branch 'master' into feat/webpack

d035b00

ozyx suggested changes Nov 21, 2023

View reviewed changes

evenstensberg added 2 commits November 22, 2023 20:11

Merge branch 'master' into feat/webpack

89b1361

chore: review comments

1e9f055

fix: use defaults in terser

6b679d7

Use the default options provided by terser

unlikelyzero reviewed Dec 11, 2023

View reviewed changes

unlikelyzero approved these changes Dec 11, 2023

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

chore(webpack): first pass on better webpack build #7038

chore(webpack): first pass on better webpack build #7038

evenstensberg commented Sep 6, 2023 •

edited

Loading

evenstensberg commented Sep 6, 2023

deploysentinel bot commented Sep 6, 2023 •

edited

Loading

Top 1 Common Error Messages

Test Case Results

codecov bot commented Sep 6, 2023 •

edited

Loading

unlikelyzero commented Sep 6, 2023 •

edited

Loading

evenstensberg commented Sep 7, 2023

evenstensberg commented Sep 8, 2023

ozyx commented Sep 11, 2023

ozyx left a comment

evenstensberg commented Sep 13, 2023

evenstensberg commented Sep 14, 2023

evenstensberg commented Sep 14, 2023

ozyx commented Sep 22, 2023

ozyx commented Sep 26, 2023

evenstensberg left a comment

ozyx commented Oct 15, 2023

evenstensberg commented Oct 15, 2023

unlikelyzero left a comment

ozyx left a comment

evenstensberg commented Oct 26, 2023

ozyx left a comment •

edited

Loading

This comment was marked as outdated.

evenstensberg commented Nov 17, 2023

ozyx left a comment

ozyx Nov 21, 2023

evenstensberg Nov 22, 2023

evenstensberg commented Nov 22, 2023

evenstensberg commented Dec 9, 2023

unlikelyzero Dec 11, 2023

unlikelyzero left a comment

chore(webpack): first pass on better webpack build #7038

Are you sure you want to change the base?

chore(webpack): first pass on better webpack build #7038

Conversation

evenstensberg commented Sep 6, 2023 • edited Loading

Describe your changes:

All Submissions:

Author Checklist

Reviewer Checklist

evenstensberg commented Sep 6, 2023

deploysentinel bot commented Sep 6, 2023 • edited Loading

Current Playwright Test Results Summary

⚠️ Flakes

Top 1 Common Error Messages

Test Case Results

codecov bot commented Sep 6, 2023 • edited Loading

Codecov Report

unlikelyzero commented Sep 6, 2023 • edited Loading

evenstensberg commented Sep 7, 2023

evenstensberg commented Sep 8, 2023

ozyx commented Sep 11, 2023

ozyx left a comment

Choose a reason for hiding this comment

evenstensberg commented Sep 13, 2023

evenstensberg commented Sep 14, 2023

evenstensberg commented Sep 14, 2023

ozyx commented Sep 22, 2023

ozyx commented Sep 26, 2023

evenstensberg left a comment

Choose a reason for hiding this comment

ozyx commented Oct 15, 2023

evenstensberg commented Oct 15, 2023

unlikelyzero left a comment

Choose a reason for hiding this comment

ozyx left a comment

Choose a reason for hiding this comment

evenstensberg commented Oct 26, 2023

ozyx left a comment • edited Loading

Choose a reason for hiding this comment

This comment was marked as outdated.

evenstensberg commented Nov 17, 2023

ozyx left a comment

Choose a reason for hiding this comment

ozyx Nov 21, 2023

Choose a reason for hiding this comment

evenstensberg Nov 22, 2023

Choose a reason for hiding this comment

evenstensberg commented Nov 22, 2023

evenstensberg commented Dec 9, 2023

unlikelyzero Dec 11, 2023

Choose a reason for hiding this comment

unlikelyzero left a comment

Choose a reason for hiding this comment

evenstensberg commented Sep 6, 2023 •

edited

Loading

deploysentinel bot commented Sep 6, 2023 •

edited

Loading

codecov bot commented Sep 6, 2023 •

edited

Loading

unlikelyzero commented Sep 6, 2023 •

edited

Loading

ozyx left a comment •

edited

Loading