Well I am working on a new website using gatsby JS, And I decided to adept this starter:
https://github.com/scttcper/gatsby-casper
Everything is great with this starter except for one annoying thing. The scrolling is not smooth and feels laggy.
It most likely has to do with how they're doing the flow of the page and how intense it is on the GPU, there's pretty intense CSS.
When the page shrinks it changes to the alternate layout declared here:
https://github.com/scttcper/gatsby-casper/blob/master/src/templates/index.tsx#L28
So I tried to play with @media (min-width: 795px) value but with no effect.
Please note that when resizing the browser to a small window it starts scrolling smoothly.
Any ideas?
Edit: I found out that background-size:cover has terrible performance and this starter uses a lot of this so I removed it and resized and compress the pictures but the lag is still there in high-resolution screens.