Everyone wants their digital workplace to be not only beautiful, but fast. Slow pages make for a frustrating experience and make people unlikely to return. Your time—and your team's time—is money, and following these performance best practices with LiveTiles can save you both.
LiveTiles Design does not have a specific restriction on number of tiles on a page. The page does not automatically slow down with each new tile on it. The best accounting of design elements that affect perceived page performance is actually the number of images—especially large images—and the number of dynamic tiles.
Images will cause a second flash after the render, as they are requested and potentially leave your background with just a color, rather than your big beautiful background image. Dynamic tiles are tiles that load external data sources—such as the Documents, RSS Feed, and Cloud Documents tiles. These tiles load their content asynchronously and independently. They will sit with a spinner on them until the data returns, and choosing to use them imposes a second wait period. In general, you should use the minimal number of dynamic tiles and images, ideally providing other useful visual content on the page aside from the dynamic tiles.
In order to understand the performance considerations of the page in-depth, it's important to understand the life-cycle of the page:
Minimize Page Size
Minimizing the total size of the page makes for a faster initial load and better browsing experience.
Other Considerations to Minimize Page Load Times Include:
Making sure images used for backgrounds, image tiles, and News tiles are appropriately sized in resolution for their purpose (i.e. you don't need a 4MB background image). If performance is of paramount importance, avoid images unless absolutely necessary.If you need to use a lot of images, icons, etc., consider using a Content Delivery Network for your assets. The same applies if you use the Code Snippet Tile (or use code inline so it is cached with the page). Avoid managing and accessing the files in a SharePoint library.Given that embedded content is outside the control of our page code, use features like the slide out panel or modals to avoid loading embedded content on the main page. For Office 365, the proximity of your tenant to the user can have a dramatic effect on page load. For responsive pages, if you end up hiding half the content on a page you should consider whether building a second page with a targeted experience is actually a better option. Most importantly, test repeatedly until you achieve your desired outcome.
The Cost of Slow Pages
It's a problem with a lot of industry research behind it (see infographic below) and is considered often in consumer-facing web apps, but often falls to the wayside when considering how to build intranets and other internal tools for a company.