In this post we are going to see ionic 3 and ionic 4 performance tips to decrease loading time, so you are an ionic developer you may notice that you finish your application and test in a real device you see how much it takes to just load even if lately with the latest updates from ionic team it becomes much faster, however you can optimize more.

Lazy Loading Web Components

The first thing you gonna do is to implement lazy loading, even it's implemented by default you generate a new page for example with ionic g page pageName, with ionic 3 we use @IonicPage to lazy load our pages, with ionic 4 we use Angular components with Angular routing. so to understand clearly this lazy loading, it's very simple idea just instead of loading all page on lunch time, we only load the components needed. That means when you write a component like <ion-button> this component will only be loaded individually when it's accessed the application, and that's what makes ionic amazing because all that works for you behind the scenes by default.

Tappable/Clicking components

There was a clickable elements by default like buttons and links, but in mobile you may want another element to be clickable like div, img .... or even an ionic component like <ion-card> so for that you must add a very important attribute tappbale like this:

<ion-header tappable> click here </ion-header>

Enable Prod Mode

Add this one important function on your file main.ts after importing the function

import "enableProdeMode" from @angular/core

enableProdeMode()

by doings this you will save a bit of time loading for you, it will enable the production mode you finally build your application for production.

Build For Production

ionic cordova build android --prod --release

by doing this you will notice a decrease of the size of apk file and also the application works more fast.

Files Optimization

If you work with images for you have to optimize theme by compressing theme and also use small files with .JPG .JPEG be aware of .PNG files, and it's preferable to host all your files somewhere in the internet and not on your application in the device storage because it will be uninstalled directly from users.