Live Updates are smaller and faster if they include only the modified files, or differentials, from previous updates. This is accomplished via a manifest file.
Why do I need manifest file?
A Live Updates manifest file includes a hash for every file in the built web directory (
www for Angular apps or
dist for React apps for example). When a native iOS or Android build is created in Appflow, a manifest file is automatically created for the web portion of the app. When you send out a new Live Update to end user devices, the manifest file embedded in the native app is compared to the manifest in the Live Update. Only changed files will be downloaded.
This makes the Live Update much smaller and faster, resulting in improved performance over slower connections.
If there isn't a manifest file in the bundled web app, all files will be downloaded, resulting in unnecessarily slower updates. In the Cordova-based SDK, this file is called
pro-manifest.json. The Capacitor-based SDK uses
How do I generate the manifest file?
If using Appflow for Native Builds
- If you use Appflow to build the native binaries, Appflow creates the manifest file for you automatically and includes it in the static files. This leads to better subsequent deploys.
- This can be seen in Appflow right after the
npm run buildstep alongside
ionic infoand before
step: cap_sync. Both Live Updates manifest files are created to ensure a smooth migration from the Cordova SDK to the Capacitor one.
Generating app manifest...
$ ionic live-update manifest
▸ [OK] Appflow Deploy manifest written to ./www/live-update-manifest.json!
If using Cordova and not using Appflow for Native Builds
The manifest should be generated automatically on the
cordova prepareevent (Cordova hooks). No additional action required.
Since Cordova takes care of this, any subsequent Live Updates to the native build should download only the differentials.
If using Capacitor and not using Appflow for Native Builds
You are required to generate the manifest files manually for Capacitor apps.
If you use the Cordova SDK (
cordova-plugin-ionic), run command
ionic live-update manifest.
ionic live-update manifest
[OK] Appflow Deploy manifest written to ./www/pro-manifest.json!
If you use the Capacitor SDK (
# Install Ionic Cloud CLI
curl -fsSL https://ionic.io/get-ionic-cloud-cli | bash
# Generate manifest. WEB DIR = www, dist, etc.
ionic-cloud live-update generate-manifest --dir=[WEB DIR]`
Since the manifest file needs to be created after you have modified the web assets, you need to run
npm run build after creating the web assets and before you copy or update the plugins and platforms using
npx cap sync or
npx cap copy.
npm run build
ionic live-update manifest
npx cap sync
The simplest way to manage that locally is by adding it to the build script in
"start": "ng serve",
"build": "ng build; ionic live-update manifest",
There can be issues when the manifest is prepared on Windows due to how line endings are handled and committed. If you're building for native on Windows you may want to try a build using Appflow and see if you notice an improvement.
How do I know if my app contains a manifest file?
You can verify the Live Updates manifest file by extracting the production
.ipa/.apk file and checking for the presence of
live-update-manifest.json in the web directory of choice.