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

fix: various automagic npm module installation fixes #512

Merged
merged 4 commits into from
Dec 4, 2020

Conversation

erickzhao
Copy link
Member

@erickzhao erickzhao commented Oct 22, 2020

This PR has 3 bugfixes relating to the way we import npm modules. Each is in a separate commit.

Note: this PR adds in a new dependency to the decomment module, which uses the Esprima JavaScript parser under the hood to strip any JS code fed in of its comments. I decided to use a library rather than play around with regexes for reliability's sake. decomment is licensed under MIT, so it should be compatible with Electron Fiddle for licensing purposes.

@coveralls
Copy link

coveralls commented Oct 22, 2020

Coverage Status

Coverage decreased (-0.05%) to 93.545% when pulling 93c24dd on erick/npm-polishing into df22a5f on master.

@erickzhao erickzhao requested review from a team and felixrieseberg October 22, 2020 23:45
@felixrieseberg
Copy link
Member

Big fan, but I'm pretty unsure about including decomment, which bundles esprima. That's ten Reacts in terms of size 😬

@erickzhao
Copy link
Member Author

@felixrieseberg I agree that it's a pretty big package to fix an edge case in our code, but if we want to provide a stable experience for users to require packages automatically, using a parser rather than regex to detect these module installs should be the way to go, even if it's to solve an edge case.

Are there big performance impacts at this bundle level for loading the local bundle? For reference, decomment seems to be 135kb minified while react-dom is 121kb.

As for alternatives, I'm not too familiar with using different parsers, but we could probably shave off 25kb here by using acorn or meriyah directly instead. I'm not sure we can decrease that any further.

Maybe we can lazy load the module rather than import at the top of the file?

@issacgerges
Copy link
Contributor

issacgerges commented Nov 5, 2020

Its unfortunate you can't lean on the tokenizer that's being used internally by monaco. I played around with this a bit but wasn't able to get access to it. microsoft/monaco-typescript#65

I think the only real impact of bloat here is a small bump in bundle size and load time spent parsing/optimizing the additional javascript.

Copy link
Member

@felixrieseberg felixrieseberg left a comment

Choose a reason for hiding this comment

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

Good stuff! I'd only check whether this survives compilation but it looks fantastic otherwise 👏

@erickzhao erickzhao merged commit af59430 into master Dec 4, 2020
@erickzhao erickzhao deleted the erick/npm-polishing branch December 4, 2020 21:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
4 participants