Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Experimental inline / deferred requires optimiser #9221

Merged
merged 7 commits into from Oct 4, 2023

Conversation

marcins
Copy link
Contributor

@marcins marcins commented Aug 29, 2023

↪️ Pull Request

This PR implements a new optional and experimental optimiser parcel-optimizer-experimental-inline-requires which defers evaluation of required dependencies of a module until they are accessed.

We are successfully using this plugin in our very large application to get 5-10% runtime startup performance improvements - it is likely this doesn't have the same benefit for all, or smaller projects, so it is also likely this functionality would always be optional.

See the README.md in this PR for details of how this works, and the caveats around things like side effects.

💻 Examples

See the README.md in this PR for details.

🚨 Test instructions

Can be tested by adding it to any project, and verifying that it has not broken anything at runtime.

✔️ PR Todo

  • Added/updated unit tests for this change
  • Filled out test instructions (In case there aren't any unit tests)
  • Included links to related issues/PRs

yarn.lock Outdated
Copy link
Contributor Author

@marcins marcins Aug 29, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not sure why this modification exists.. I saw this in another PR.. probably something that changed in an earlier PR and wasn't committed (or could be related to the fact it was pointing to the Atlassian registry..)

@parcel-benchmark
Copy link

parcel-benchmark commented Aug 29, 2023

Benchmark Results

Kitchen Sink ✅

Timings

Description Time Difference
Cold 1.42s +6.00ms
Cached 283.00ms -53.00ms 🚀

Cold Bundles

Bundle Size Difference Time Difference
dist/legacy/parcel.7cdb0fad.webp 102.94kb +0.00b 238.00ms -16.00ms 🚀
dist/modern/parcel.7cdb0fad.webp 102.94kb +0.00b 238.00ms -15.00ms 🚀

Cached Bundles

Bundle Size Difference Time Difference
dist/legacy/index.b8ae99ba.css 94.00b +0.00b 253.00ms -13.00ms 🚀
dist/modern/index.31cedca9.css 94.00b +0.00b 253.00ms -14.00ms 🚀

React HackerNews ✅

Timings

Description Time Difference
Cold 3.74s -93.00ms
Cached 468.00ms +69.00ms ⚠️

Cold Bundles

Bundle Size Difference Time Difference
dist/index.js 459.11kb +0.00b 920.00ms -54.00ms 🚀

Cached Bundles

Bundle Size Difference Time Difference
dist/PermalinkedComment.e9dc4a75.js 3.92kb +0.00b 295.00ms -17.00ms 🚀
dist/UserProfile.8945a243.js 1.38kb +0.00b 295.00ms -17.00ms 🚀
dist/NotFound.8b44a81d.js 269.00b +0.00b 295.00ms -17.00ms 🚀

AtlasKit Editor ✅

Timings

Description Time Difference
Cold 30.87s -115.00ms
Cached 2.06s -193.00ms 🚀

Cold Bundles

Bundle Size Difference Time Difference
dist/media-viewer.38e3999a.js 536.13kb +0.00b 10.02s +2.99s ⚠️
dist/mobile-upload.f21df36e.js 66.34kb +0.00b 4.46s +253.00ms ⚠️
dist/component-lazy.51d1dec9.js 58.94kb +0.00b 5.33s +314.00ms ⚠️
dist/component.a781cbb6.js 57.16kb +0.00b 4.45s +234.00ms ⚠️
dist/DatePicker.042aeb21.js 47.46kb +0.00b 5.33s +316.00ms ⚠️
dist/Modal.38d9f78c.js 27.83kb +0.00b 4.45s +243.00ms ⚠️
dist/DatePicker.dd4c3679.js 24.96kb +0.00b 5.33s +315.00ms ⚠️
dist/component.c2c7f470.js 18.68kb +0.00b 4.45s +243.00ms ⚠️
dist/js.e1035d4d.js 17.15kb +0.00b 4.45s +243.00ms ⚠️
dist/mobile-upload.3747b689.js 7.79kb +0.00b 4.45s +243.00ms ⚠️
dist/Modal.850345b4.js 3.86kb +0.00b 4.45s +243.00ms ⚠️
dist/component.360dba95.js 3.20kb +0.00b 4.45s +243.00ms ⚠️
dist/png-chunks-extract.92497b2d.js 3.06kb +0.00b 4.45s +243.00ms ⚠️
dist/codeViewerRenderer.51140ec8.js 2.61kb +0.00b 7.25s -2.57s 🚀
dist/ResourcedEmojiComponent.9a253c26.js 2.47kb +0.00b 5.33s +315.00ms ⚠️
dist/pl.bce591be.js 2.25kb +0.00b 5.33s +315.00ms ⚠️
dist/cs.bf42283b.js 2.23kb +0.00b 5.33s +315.00ms ⚠️
dist/de.90d5c4fa.js 2.17kb +0.00b 5.33s +315.00ms ⚠️
dist/fr.ff5d335f.js 2.13kb +0.00b 5.33s +314.00ms ⚠️
dist/es.80bf0476.js 2.12kb +0.00b 5.33s +315.00ms ⚠️
dist/hu.223c2cde.js 2.10kb +0.00b 5.33s +314.00ms ⚠️
dist/fi.98bb8fa8.js 2.09kb +0.00b 5.33s +315.00ms ⚠️
dist/ja.7d4156df.js 2.09kb +0.00b 5.33s +315.00ms ⚠️
dist/pt_BR.b9e37d37.js 2.06kb +0.00b 5.33s +315.00ms ⚠️
dist/ko.9c6bf469.js 1.98kb +0.00b 5.33s +314.00ms ⚠️
dist/it.04edb54a.js 1.97kb +0.00b 5.33s +314.00ms ⚠️
dist/nb.9bd6db78.js 1.96kb +0.00b 5.33s +315.00ms ⚠️
dist/date.139a08b0.js 1.95kb +0.00b 4.70s +286.00ms ⚠️
dist/da.d2d8303e.js 1.95kb +0.00b 5.33s +315.00ms ⚠️
dist/nl.c4d12122.js 1.94kb +0.00b 5.33s +315.00ms ⚠️
dist/images.774ef3be.js 1.90kb +0.00b 4.70s +287.00ms ⚠️
dist/feedback.4b745631.js 1.76kb +0.00b 5.33s +316.00ms ⚠️
dist/status.20808f9b.js 1.67kb +0.00b 4.70s +287.00ms ⚠️
dist/code.3ce450f8.js 1.56kb +0.00b 4.70s +286.00ms ⚠️
dist/workerHasher.4f6584da.js 1.56kb +0.00b 4.45s +239.00ms ⚠️
dist/list-number.fdc97a50.js 1.47kb +0.00b 4.70s +286.00ms ⚠️
dist/heading6.e6e03f52.js 1.36kb +0.00b 5.33s +316.00ms ⚠️
dist/16.4998f52b.js 1.35kb +0.00b 4.45s +236.00ms ⚠️
dist/heading3.73972e33.js 1.35kb +0.00b 4.70s +287.00ms ⚠️
dist/16.330880f6.js 1.29kb +0.00b 4.45s +244.00ms ⚠️
dist/link.71e06c5e.js 1.28kb +0.00b 4.70s +286.00ms ⚠️
dist/emoji.8f9f45dc.js 1.25kb +0.00b 4.70s +287.00ms ⚠️
dist/heading5.d2f94d9d.js 1.23kb +0.00b 5.33s +316.00ms ⚠️
dist/expand.c983e90a.js 1.18kb +0.00b 5.33s +315.00ms ⚠️
dist/heading2.c27d912d.js 1.17kb +0.00b 4.70s +286.00ms ⚠️
dist/heading4.be08fc9e.js 1.12kb +0.00b 4.70s +287.00ms ⚠️
dist/mention.f4723418.js 1.09kb +0.00b 4.70s +286.00ms ⚠️
dist/layout.b5e3a7ef.js 1.05kb +0.00b 4.70s +286.00ms ⚠️
dist/divider.7bb33712.js 1.04kb +0.00b 4.70s +287.00ms ⚠️
dist/action.c407ac14.js 1.02kb +0.00b 4.70s +286.00ms ⚠️
dist/heading1.d7caae19.js 1.02kb +0.00b 4.70s +287.00ms ⚠️
dist/16.371e251f.js 1.00kb +0.00b 4.45s +245.00ms ⚠️
dist/list.bd698aa0.js 1011.00b +0.00b 4.70s +286.00ms ⚠️
dist/quote.d6bda47a.js 1011.00b +0.00b 4.70s +286.00ms ⚠️
dist/decision.a17a0d00.js 992.00b +0.00b 4.70s +287.00ms ⚠️
dist/16.8adad466.js 980.00b +0.00b 4.45s +244.00ms ⚠️
dist/16.71432140.js 980.00b +0.00b 4.45s +235.00ms ⚠️
dist/panel-warning.772e8569.js 968.00b +0.00b 4.70s +286.00ms ⚠️
dist/16.e5f05248.js 960.00b +0.00b 4.45s +243.00ms ⚠️
dist/16.549c63e3.js 955.00b +0.00b 4.70s +286.00ms ⚠️
dist/table.e0e68580.js 946.00b +0.00b 4.70s +287.00ms ⚠️
dist/16.79864de1.js 920.00b +0.00b 4.46s +244.00ms ⚠️
dist/panel.45c00b08.js 887.00b +0.00b 4.70s +286.00ms ⚠️
dist/panel-error.bfda44fb.js 864.00b +0.00b 4.70s +286.00ms ⚠️
dist/16.7d7d7930.js 862.00b +0.00b 4.46s +244.00ms ⚠️
dist/16.4556c00f.js 834.00b +0.00b 4.46s +244.00ms ⚠️
dist/16.a44bb474.js 827.00b +0.00b 4.45s +244.00ms ⚠️
dist/16.bf9fb66d.js 821.00b +0.00b 4.70s +286.00ms ⚠️
dist/panel-success.4afcba7a.js 805.00b +0.00b 4.70s +286.00ms ⚠️
dist/panel-note.58ef2b52.js 795.00b +0.00b 4.70s +286.00ms ⚠️
dist/16.dffb58fe.js 782.00b +0.00b 4.45s +236.00ms ⚠️
dist/16.0118b1f8.js 776.00b +0.00b 4.45s +244.00ms ⚠️
dist/16.9a311f76.js 776.00b +0.00b 4.45s +245.00ms ⚠️
dist/16.edf70d70.js 775.00b +0.00b 4.45s +241.00ms ⚠️
dist/16.4af9f37f.js 774.00b +0.00b 4.45s +244.00ms ⚠️
dist/16.aa70dcce.js 773.00b +0.00b 4.45s +244.00ms ⚠️
dist/16.c715b7e1.js 746.00b +0.00b 4.70s +286.00ms ⚠️
dist/16.54ffa2b2.js 725.00b +0.00b 4.45s +243.00ms ⚠️
dist/16.d7c3881b.js 697.00b +0.00b 4.46s +244.00ms ⚠️
dist/pt_PT.e211e609.js 635.00b +0.00b 5.33s +315.00ms ⚠️
dist/et.88ef7cb4.js 633.00b +0.00b 5.33s +315.00ms ⚠️
dist/simpleHasher.09765db3.js 589.00b +0.00b 4.45s +239.00ms ⚠️
dist/is.5f045a22.js 495.00b +0.00b 5.33s +314.00ms ⚠️
dist/en_GB.4c40e6c6.js 472.00b +0.00b 5.33s +315.00ms ⚠️
dist/en.e1d21f6d.js 469.00b +0.00b 5.33s +315.00ms ⚠️
dist/index.html 248.00b +0.00b 5.34s -1.65s 🚀

Cached Bundles

Bundle Size Difference Time Difference
dist/editorView.a0126b37.js 619.22kb +0.00b 11.60s -591.00ms 🚀
dist/ConfigPanelFieldsLoader.182d39bc.js 303.43kb +0.00b 6.62s -447.00ms 🚀
dist/card.d06de810.js 138.91kb +0.00b 6.61s -447.00ms 🚀
dist/ElementBrowser.e8f01080.js 61.94kb +0.00b 6.62s -439.00ms 🚀
dist/esm.bfca2115.js 59.30kb +0.00b 6.61s -454.00ms 🚀
dist/ConfigPanelFieldsLoader.2b7c03be.js 15.74kb +0.00b 6.61s -447.00ms 🚀
dist/ui.8c117104.js 14.48kb +0.00b 6.62s -439.00ms 🚀
dist/ConfigPanelFieldsLoader.5dfde67d.js 13.63kb +0.00b 6.61s -447.00ms 🚀
dist/pdfRenderer.01deafa1.js 12.04kb +0.00b 6.61s -446.00ms 🚀
dist/mobile-upload.3baad8e4.js 7.79kb +0.00b 6.62s -445.00ms 🚀
dist/mobile-upload.7a892a37.js 7.79kb +0.00b 6.62s -445.00ms 🚀
dist/ru.0cf3f40e.js 2.81kb +0.00b 6.61s -446.00ms 🚀
dist/uk.282f23b1.js 2.76kb +0.00b 6.61s -447.00ms 🚀
dist/codeViewerRenderer.51140ec8.js 2.61kb +0.00b 6.61s -3.40s 🚀
dist/th.137e1013.js 2.60kb +0.00b 6.61s -446.00ms 🚀
dist/vi.b46097db.js 2.09kb +0.00b 6.61s -448.00ms 🚀
dist/tr.c85d90a9.js 2.03kb +0.00b 6.61s -447.00ms 🚀
dist/sv.1c06c95c.js 1.98kb +0.00b 6.61s -446.00ms 🚀
dist/zh_TW.b7c55aa6.js 1.86kb +0.00b 6.61s -448.00ms 🚀
dist/zh.b01fe721.js 1.84kb +0.00b 6.61s -447.00ms 🚀
dist/workerHasher.540c9790.js 1.56kb +0.00b 6.62s -438.00ms 🚀
dist/workerHasher.c840c607.js 1.56kb +0.00b 6.62s -445.00ms 🚀
dist/sk.4be9c93f.js 656.00b +0.00b 6.61s -446.00ms 🚀
dist/simpleHasher.c14e20b4.js 589.00b +0.00b 6.62s -445.00ms 🚀
dist/simpleHasher.23db7a52.js 589.00b +0.00b 6.62s -445.00ms 🚀
dist/ro.8d5b380a.js 482.00b +0.00b 6.61s -446.00ms 🚀
dist/index.html 248.00b +0.00b 4.91s -5.14s 🚀

Three.js ✅

Timings

Description Time Difference
Cold 2.82s -20.00ms
Cached 297.00ms -14.00ms

Cold Bundles

No bundle changes detected.

Cached Bundles

No bundle changes detected.

Click here to view a detailed benchmark overview.

@marcins
Copy link
Contributor Author

marcins commented Aug 29, 2023

I realised I didn't flow type the new files - started working on that locally, but without types for @swc/core and @swc/core/Visitor it's a meh.. so just seeing if I can convert the TS types to be able to use them.

EDIT: flowgen built types (and massaged) for @swc/core and @swc/core/Visitor have been added to the repo.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This file is mostly generated with flowgen from the TypeScript types that come with @swc/core.

I had to do a little massaging to make them work, but they pass for this repo.

@devongovett
Copy link
Member

Do we want "experimental" in the package name? Do you think this will ever be not experimental? If so, we'll have to change the name and deprecate the package. Would be it better to just indicate this in the readme or something?

@marcins marcins merged commit b882b43 into v2 Oct 4, 2023
16 checks passed
@marcins marcins deleted the mszczepanski/experimental-inline-requires branch October 4, 2023 00:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants