Gatsby website shows a black screen before loading the contents

Website: https://zesty-kitten-8e3b5a.netlify.app/

Why it does shows a black screen before loading the contents?

Please help!

@ouafiabdelhakim58 Because that is the background color of your page:

image

Your site is a Gatsby based SPA (Single Page Application) so much of the page doesn’t actually exist until the JavaScript is loaded, excutes and then generates it at runtime.

1 Like

Thanks for your answer, so how can I fix this issue? Any suggestions please?

@ouafiabdelhakim58 What issue?

If you want the color to be different then change it in your source code.

If you want the page to “load faster” then optimize your site.

The page is approximately 2.5mb of which 2.1mb is JavaScript:

image

1 Like

Thanks, can u suggest a way to optimise my website speed loading?

@ouafiabdelhakim58 Not really no, you should research that yourself based on what you’re working with and what you’re trying to do.

Generally you just want to “send less data and do less”.

If you wanted that page, (and only that page), to load quickly it could be a very small amount of plain HTML and CSS.

1 Like