You can enhance the performance of your responsive apps just by refining the design!
Skill Level: Intermediate
- To keep your app speedy, make sure to be careful with the number of components on any given screen. Too many components can make screen loading slow for your users! Try dividing up the screen into a flow of screens for your users. More screens is better for user performance and experience than one screen with lots of components.
- Avoid nesting components too deeply in parent and child components - nested parents that are over 4 components deep will most likely experience lower loading speeds and unexpected results. Furthermore, deeply nested components make it much more difficult to manage the layout settings of those components. Consider breaking up the screen into multiple screens or reworking your database to display the data you need to display.
- Relationships can slow down the builder if you use too many of them or have deep data being displayed. Consider consolidating similar collections into a single collection. For example, rather than having a collection for Shoes, Pants, Shirts, and Hats, we would create one collection called Clothing Pieces with a text property called Type to hold these different types.
- Since text and images are generated responsively in the builder, having large bodies of text, background images, or other uploaded images can slow down the builder. Consider storing lots of text and images in the database as dynamic data if possible rather than showing them as static, fixed components.