CODEWITHSUNDEEP
javascriptreactjsnext.jssafariimage-optimization
Anthony T
Anthony T

Reputation: 133

NextJs app loading slow on safari but fine on chrome, why?

I'm developing a web app with nextjs. I've found linking to pages (specifically home page, which loads multiple svgs and images) lags and doesn't even show loader while using safari, but I'm happy with the performance on chrome. I've seen people mention sharp, which I have installed. Others have mentioned slow development time but faster in production, not the case for me because i've tested in both environments. Any insight would be appreciated, as I said the performance lag seems specific to safari as I only find experience it on safari both mobile and desktop.

The production site here: cloud9.atoffettidev.com

The git repository here: git repo

Upvotes: 2

Views: 1110

Answers (1)

Anthony T
Anthony T

Reputation: 133

I narrowed the performance hits on safari browser down to the importing of numerous svgs on my home page. I was importing the svgs as react components laced with svg syntax, so I switched them to .svg files. Then I ran those .svg files through a optimizer/minifier and I got pretty good results using them in the nextjs Image element. Now there's not much difference if any between the app's performance on chrome and safari.

Upvotes: 4

Related Questions