Performance is an increasingly critical point in the creation of a store and, to ensure that your theme is within our best optimization practices, we created this course totally focused on points of improvement in a theme.

For this course, we can use a complete theme to focus only on points for improvement.

Clone the repository: https://github.com/vtex-apps/demostore-theme

Not all content on a page needs to be loaded first. Initially, when a user enters the store there is a limit on how much he can see. That is why with the __fold__ block you are able to control what will initially be seen, thus reducing the need to load data in the initial _ load _. Automatically, what is below __fold__ is, then, loaded after the essentials are already available and the user starts to _ scroll _ down.

1. Run a vtex workspace reset ensuring that no other themes are linked in the store

2. Go to the cloned repository directory and link and then the offered theme:

   
   

   _10

   vtex link

   
   

   You should see the following store:

   

3. The content below the Clearance shelf cannot be seen by the user, so let's optimize the first upload, postponing the _ fetching _ of this. To do this, in the home.jsonc file in the /store/blocks/home/ directory, add the __fold__ block just below the "shelf#clearance":

   
   

   _13

   "store.home": {

   _13

   "blocks": [

   _13

   "flex-layout.row#slider",

   _13

   "shelf#new-arrivals",

   _13

   "shelf#clearance",

   _13

   + "__fold__",

   _13

   "flex-layout.row#newsletter",

   _13

   "rich-text#brands",

   _13

   "flex-layout.row#brands",

   _13

   "rich-text#instagram",

   _13

   "flex-layout.row#instagram"

   _13

   ]

   _13

   }

   
   

In your browser, then, run a CTRL (Cmd) + - (zooming out to be able to see the whole page) and notice that everything below theClearance is loaded after (as soon as the scroll is executed) to what is above: