Next.js Discord

Discord Forum

Components is taking so much time to load

Unanswered
American Shorthair posted this in #help-forum
Open in Discord
American ShorthairOP
Hello, In my Next.Js 15.2.4 app router application, some of the components is taking so much time to load, but that lags happens only after like 4 days of a restart, so when i stop the app and run the server again it's fast

83 Replies

American ShorthairOP
Website is at https://lutex.io for anyone who wants to look more
The Landing page is also taking so much time to load as well
Dwarf Hotot
@American Shorthair Your home page is 5mb ?
@Dwarf Hotot <@589989048005689366> Your home page is 5mb ?
American ShorthairOP
It's 51.6kb
@American Shorthair It's 51.6kb
Dwarf Hotot
it shows 5mb at network tab
Dwarf Hotot
also animations can make it look "loading slow" especially at slow pc s
@Dwarf Hotot also animations can make it look "loading slow" especially at slow pc s
American ShorthairOP
Yea but the problem is that it's not even rendering the content
Which browser are you using?
Dwarf Hotot
firefox
American ShorthairOP
That's weird
what could be the reasons of that huge size?
also in brave it's showing me that the size is 51.6kb, why did it take 5mb to load?
+ when i do a restart to the server it's loading fast as it should
Dwarf Hotot
can i see your build logs @American Shorthair
@Dwarf Hotot can i see your build logs <@589989048005689366>
American ShorthairOP
On local?
Dwarf Hotot
vercel
American ShorthairOP
I don't use vercel
Dwarf Hotot
only last block
which says static ...
American ShorthairOP
1s
@Dwarf Hotot
Dwarf Hotot
looks okay, maybe your host is slow
also 1s is okay for a page which have heavy animation
like threejs
@Dwarf Hotot looks okay, maybe your host is slow
American ShorthairOP
hmm that's weird
@Dwarf Hotot also 1s is okay for a page which have heavy animation
American ShorthairOP
no i meant 1s lemme get you the logs 😂
@American Shorthair no i meant 1s lemme get you the logs 😂
Dwarf Hotot
no i meant i checked it on network tab and showed 1s to load time, its okay
@Dwarf Hotot no i meant i checked it on network tab and showed 1s to load time, its okay
American ShorthairOP
Hmm, my friend said the same thing, maybe i'm the only one who have this issue
But also 5mb to load landing page? that's alot
@American Shorthair Hmm, my friend said the same thing, maybe i'm the only one who have this issue
Dwarf Hotot
can we see your lighthouse reports to check what is wrong
American ShorthairOP
and will be a problem for those who have a slow internet like me
Dwarf Hotot
or pagespeed insights
if you have a thing faster than 3g its okay to have 1sec load times
@Dwarf Hotot can we see your lighthouse reports to check what is wrong
American ShorthairOP
Sure
Dwarf Hotot
my near empty page takes 500ms
@Dwarf Hotot my near empty page takes 500ms
American ShorthairOP
hmm, so my website is considered fast?
Dwarf Hotot
37 requests
1.1 MB transferred
3.6 MB resources
Finish: 780 ms
American ShorthairOP
Dwarf Hotot
yep but fast load is not same with fast rende
its rendering slow
that is what i mean
@Dwarf Hotot yep but fast load is not same with fast rende
American ShorthairOP
Yes it's taking long time to render
Dwarf Hotot
for that i need to see the code
American ShorthairOP
Can i dm?
Your local LCP value of 15.75 s is poor.
LCP element
img.w-full.h-full.object-cover
It's saying that it is because of the image under that text
Dwarf Hotot
yep @American Shorthair
@Dwarf Hotot yep <@589989048005689366>
American ShorthairOP
Will making it lazy load fix the issue?
i will try that
@American Shorthair Will making it lazy load fix the issue? i will try that
Dwarf Hotot
okay let me know the result
@Dwarf Hotot okay let me know the result
American ShorthairOP
I've completely removed the image and now it's telling me

Your local LCP value of 12.59 s is poor.
LCP element
p.max-w-2xl.mx-auto.text-description-color.text-sm.lg:text-xl

Which is the description, That is just so weird
American ShorthairOP
i removed framer-motion and it reduced to 3.12s
American ShorthairOP
@Dwarf Hotot Can you tell me what does it shows for you?
@American Shorthair <@1257609464811487255> Can you tell me what does it shows for you?
Dwarf Hotot
I ll check when i on the pc, but i guessed right. Animations making things so slow and sluggish.
Dwarf Hotot
Also you can send me lighthouse reports and google pagespeed insights
Dwarf Hotot
its 1.94 s LCP on mine, but this depends on hardware and network so its not a descriptive metric to measure performance
For me its 660ms on network tab, but your / is still large and takes most of time of 660
only 400ms is "waiting server response"
If you are not performance optimistic this values are so good, if you want more fine tuning we need to see whole codebase and hosting options
American ShorthairOP
@Dwarf Hotot
only the landing page is what taking that long, other pages is fast as they should
Idk if it's framer-motion or not
@American Shorthair <@1257609464811487255>
Dwarf Hotot
Looks like not
@Dwarf Hotot Looks like not
American ShorthairOP
Not what exactly
Dwarf Hotot
Not framer i mean
American ShorthairOP
hmm, So what's the issue
Dwarf Hotot
Is it slow when you build it locally
American ShorthairOP
Hmm, a little bit, because i have some obfuscated code
but i don't use that in the landing page
Dwarf Hotot
Well i need to see that code
American ShorthairOP
The langing page?
Dwarf Hotot
Codebase actually
American ShorthairOP
uhhhm
I can share screen to it once i get home
Dwarf Hotot
Vscode live share link would be better
American ShorthairOP
Can't give you access to the whole project sorry
Dwarf Hotot
Then just send me some files
next.config, package.json, rootlayout component and landing page
Also local build logs at terminal
Only after generating static pages block
Otherwise i cant get what is wrong
Also i will need full lighthouse report as json