Speed Issues
Unanswered
Northeast Congo Lion posted this in #help-forum
Northeast Congo LionOP
Hi, I am porting an existing html site into NextJS. The site is driven by a CMS.
The site itself in browser is fast but when I run it through google speed, it's really bad. As in, it's being scored 40/100...
https://rad-prototype.vercel.app/
The site itself in browser is fast but when I run it through google speed, it's really bad. As in, it's being scored 40/100...
https://rad-prototype.vercel.app/
164 Replies
Northeast Congo LionOP
Images are lazy loaded. I am using dynamic import for some components.
Pages are statically generated with revalidation.
@Ray took around 1s on first load and why is the rsc payload for home page is so big?
Northeast Congo LionOP
im not too sure
oh
i mean the site is content rich
@Northeast Congo Lion im not too sure
I cant find the content on the page as well?
or I miss it?
Northeast Congo LionOP
wdym sorry?
Northeast Congo LionOP
u xcant find it on homepage?
yep
Northeast Congo LionOP
that content looks like it's from the sub pages
hm
at least some of it
payload is 538kb
surely that isn't causing such terrible scores?
looking at some of the content, it's defo got some sub page content int he home page payload
@Northeast Congo Lion looking at some of the content, it's defo got some sub page content int he home page payload
yeah no idea why your rsc payload for all page are so big
Northeast Congo LionOP
frustrating
site is p fast, at least for me on poor wifi rn
but google is ranking it horribly
@Northeast Congo Lion site is p fast, at least for me on poor wifi rn
too much hydration maybe
Northeast Congo LionOP
yeah sadly, there is a lot going on JS wise.
but reduce initial time, how...?
Northeast Congo LionOP
its vercel.
static site
you've got a lot on your homepage
Northeast Congo LionOP
yep - out of my control.
are you sure you need that much
Northeast Congo LionOP
sadly, that is not my decision
but
well not but
not much else you can do
Northeast Congo LionOP
yeah
i thought so
i just need enough evidence to say to my managers
the problem is to do with how much content you're shipping to the page
Northeast Congo LionOP
look
and how much JavaScript you're sending
Northeast Congo LionOP
yeah very animation heavy
@Northeast Congo Lion i just need enough evidence to say to my managers
I can give you everything
Northeast Congo LionOP
and alot of js going on
I did mention this initially to my team but you know how that goes... lol
wait a sec
I'll get you the solidest proof out there
Northeast Congo LionOP
thanks man
even a fw points to say
this is fast I can get it.
Northeast Congo LionOP
nah so
my work dont use nextjs
and i do
this is a prototype to convince them to adopt nextjs into our flow
but they're not accepting it?
Northeast Congo LionOP
nah nah
we are meeting later today
and ik they will raise
'google flags it at 50...'
Northeast Congo LionOP
no no
oops
Northeast Congo LionOP
so when we meet later
they have seen bits of it
but they will have speed tests etc run on the prototype later today
and I know for a fact
the speed ranking by google will be raised by them
as being 'slow/low'
yeah
Northeast Congo LionOP
while the actual site itself, is, at least to me, relatively quick for whats on it
Northeast Congo LionOP
having like 45
moving parts
on homepage is hurting it
yeah
I understand
Northeast Congo LionOP
but the tie off between aestethic / performance
this for animations
@Jesse Click to see attachment
Sun bear
Hey, sorry to disturb. Saw your guys conversation and I just have one question. Is there a way to test your Next Js website speed loading speed during development ?
Northeast Congo LionOP
so
if I use google chrome lighthouse built in tool
i get higher scores.
like im min 70/75 across both devices.
@Sun bear Hey, sorry to disturb. Saw your guys conversation and I just have one question. Is there a way to test your Next Js website speed loading speed during development ?
but don't test on dev mode, test with
next build && next start@Ray but don't test on dev mode, test with `next build` && `next start`
Sun bear
Ok, thank you very much Ray.
@Northeast Congo Lion is this enough
Northeast Congo LionOP
yeah im happy to push back as content/moving parts causing the homepage to
slowww
i mean the old site compared to m,y protpty
Mark as solution?
Northeast Congo LionOP
next prototype is better ranking
but i think mngt just want to see
100 100 100 100
@Northeast Congo Lion slowww
are you fetching the data on a server component and pass it to a single client component?
Northeast Congo LionOP
yes
fetcehd in page.js
passed in
some components have unique calls for media etc
can you render some content in the server component or you need to do it on client compeont for animation?
Northeast Congo LionOP
some server
some client
client if it has gsap/framer motion
as use client is required to tap into ref/state/useEffect etc
and iirc gsap/framer motion needs client component for underlying logic
hmm no idea why you have ton of html tag in the rsc payload
Northeast Congo LionOP
but
any component not animating, is by default server
@Jesse so happy this is my performance
Northeast Congo LionOP
this is my scores on sites outside of work lol
yeah fair
Northeast Congo LionOP
i do freelance, and can consistently deliver sites with min 95 scores
we are using Umbraco CMS
and i noticed in json endpoint it has extra data being passed
essentially useless fields regarding the content
@Jesse so happy this is my performance
Northeast Congo LionOP
like this was a site i built outside of work ðŸ˜
yeah nice
I'm so annoyed I need to get my best practices to 100
it's complaining because browser errors are being logged
Northeast Congo LionOP
i imagine it'll be 1 little thing
ha
pesky console
@Ray hmm no idea why you have ton of html tag in the rsc payload
Northeast Congo LionOP
in the initial payload
i can see references to news article etc.
which are featured on homepage but its passing full content
could it be prefetch?
could it be prefetch?
Northeast Congo LionOP
is that urs?
yeah
Northeast Congo LionOP
noice
I mean I did a second try
since the first one was kinda bad
I think it's being cached
but it's fine lol
Northeast Congo LionOP
power of ISG
bro, getting business emails are so worth it
it just gives you infinite emails
if you have a catch all
I'm having to signup a bunch of times to gtmetrix since they only give you like 3 tests before you have to go pro
Northeast Congo LionOP
😂
cheat the system
whats the best practice max limit for rsc payload
I don't know
Northeast Congo LionOP
ok
just not too much
keep it minimal
Northeast Congo LionOP
so like this is better
a sub page, but yeah clearly homepage is just too FAT
yeah lol
might want to mark this as answered and mark solution
Northeast Congo LionOP
yep im gonna do it post meeting with my mngt team