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

Reduce package size #1120

Open
christiansaiki opened this issue Sep 15, 2021 · 6 comments
Open

Reduce package size #1120

christiansaiki opened this issue Sep 15, 2021 · 6 comments

Comments

@christiansaiki
Copy link
Contributor

🚀 feature request

Please reduce the package size or have documentation of how to only import what we need to use to notify airbrake of errors.

Relevant Package

@airbrake/browser

Description

I thought that moving from airbrake-js to @airbrake/browser would make a huge improvement in bundle size, but it's kind of strange that the parsed size is bigger actually.

image
image

Describe the solution you'd like

I thought of moving to sentry, but they also have a huge bundle. But I saw that someone created https://github.com/TinkoffCreditSystems/micro-sentry which has only 1.9kb minified. I wonder if you guys can do something like this.

@destari
Copy link

destari commented Sep 15, 2021

Thanks! We'll check it out! Definitely want smaller.. :)

@christiansaiki
Copy link
Contributor Author

Thank you so much @destari

@dparish
Copy link

dparish commented Jun 20, 2023

I agree with this 100%

I'd be fully on board with a modern browser only version I think a lions share of browsers now are all 'green' browsers.

My total app is only 57kb gzipped adding airbrake takes it to 70kb. That's just not worth it.

@dparish
Copy link

dparish commented Jun 20, 2023

But I see this pull issue has been opened since Sept 2021 so I guess no one cares?

@dparish
Copy link

dparish commented Jun 20, 2023

I pulled this down and compiled it and I get about 22k gzipped

I then removed babel and instead set the tsconfig target to ES2017
I also removed the promise polyfills and the fetch polyfill

I now get 11k gzipped

That's still pretty big for what it does but MUCH better. Take a look at caniuse.com. you don't need the polyfills anymore

You can lose even more weight if you get rid of the error stack parser and come up with something lighter. I suspect much of that parser is stuck in the IE11 view of the world.

If you still think you need to support every browser ever, perhaps you can offer airbrake-modern or something?

Another way to make this lighter is to move the parsing to your backend. We did this at my company for phone validation. The client side library was too big so we just spun up a node endpoint with the SAME CODE but now it's not on the client. I suspect you can do the same thing by having your API endpoint take in the error stack as an object and you handle the parsing on your end.

Code that ends up in everyones payload should be SMALL.....

@scottsbaldwin scottsbaldwin removed their assignment Jun 21, 2023
@dparish
Copy link

dparish commented Sep 29, 2023

So I got tired of waiting and just rebuilt it myself:

https://github.com/dparish/airbrake-js-lite

or:

npm install airbrake-js-lite

11k gz'd

I had to add in quite a few ts-ignore's to get it to compile and still need to put the tests back in.

It got this small by removing the polyfill's, getting rid of cross-fetch and targeting es2019.

I have not tested it thoroughly, but if you see a problem feel free to open a pr and I'll take a look.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants