OPTIMISING CANVAS APP DEVELOPMENT: MANUALLY EDITING .MSAPP FILES WHEN IDE PERFORMANCE LAGS

In the last few years, Power Platform has become the de facto low-code solution for many Microsoft shops. With this large adoption, Microsoft has also stepped up its game & is bringing more feature updates on a regular basis to the platform.

But with all the new updates coming in, some of the existing features have started to lag or are causing incompatibility challenges, especially with existing apps. One such new update is the ‘Analytics Engine’ update.

In any Power platform ecosystem which has been running for few years, we always have a few apps which have been developed before the Canvas App Analytics Engine updates were released by Microsoft.

Sometimes, for some unknown reasons these apps tend to be very slow to open in development mode & many times even a small edit change takes ~20 -30 minutes just to save. This issue is quite erratic and mostly affects apps which have been created few years back  (2023 and such…) and even Microsoft does not have a solution for the issue.

In such cases,  we can use the Power Platform Tools PAC feature to edit our app in the following way.

Prerequisite vs Code

The ‘pac’ tool is part of Power Platform CLI toolset; unfortunately, it cannot be installed directly in some restricted environments (due to admin privileges) but we can use it as an extension from Visual Studio Code. So, we will need to install VS Code in our VDI first.

You can download the same from this location: https://code.visualstudio.com/download

(choose the Windows 10/11 x64 version if needed)

Power Platform Tools Extension

Once VS Code is installed, open VS Code and open the Extensions tab.

In the ‘Extension Tab’ search for Power Platform Tools and click ‘Install’.

Once installation is completed restart the VS Code before using the commands.

Saving & Executing Methodology

This method relies on packing & unpacking the Canvas app & making changes to the YAML files of the Power App directly.

The following are the overall steps we will perform for updating the app

1. Downloading the .msapp file from the Power app development environment
2. Unpacking the .msapp file
3. Finding & updating specific yaml code
4. Packing the app back in .msapp file
5. Publishing the .msapp file

Download the .msapp file

To download the .msapp file,

• Open your app in the Canvas App development environment.
• Navigate to the ‘Save’ option and open its details menu
• Select ‘Download a copy’

• Once clicked, Power app will show the following pop-up.
• Click on ‘Download’ to download the .msapp file locally.

• Once downloaded, create a new folder preferably “C:\Code\” and move the downloaded file to the folder.

Unpack the .MSAPP file

• Open the folder in file explorer
• Right click in the folder and select ‘Open with Code’

• This will open the folder in VS code
• Click Ctrl +` to open the PowerShell terminal
• Or Open View > Terminal
• This will open the terminal window.
• In the terminal window, type the command as:
  • pac canvas unpack –msapp <path of .msapp file> –sources <full folder name>
  • Example:

• If successful you will get the source format version as the output and the specified  folder will be created in the mentioned path.
• This folder contains the entire sourcecode of your app which you can Edit.

MSAPP Structure

When unpacked, an .msapp file typically reveals a folder structure similar to this:

• \src: This is where the core of your app’s logic and design resides.
  • *.fx.yaml: These files contain the Power Fx formulas extracted from your controls and components. This is where you’d typically edit your app’s logic if you’re working with the unpacked source.
  • CanvasManifest.json: A manifest file that holds high-level information about the app, including its header, properties, and publishing details.
  • *.json: Raw control definition files.
  • EditorState*.editorstate.json: Cached information used by Power Apps Studio for editing. These files can often be ignored or deleted if issues arise.
• \DataSources: This folder contains definitions for all the data sources used by your app (e.g., SharePoint lists, Dataverse tables, SQL Server, etc.).
• \Connections: This holds information about the specific connection instances saved with your app, used when reloading the app into Power Apps Studio.
• \Assets: This is where all the media files embedded in your app (images, videos, audio) are stored.
• \pkgs: This folder contains downloaded copies of external references, such as templates, API definition files, and component libraries. These are conceptually similar to NuGet or NPM package references.
• \other: This is a catch-all for miscellaneous files needed to recreate the .msapp file.
  • entropy.json: This file stores volatile elements like timestamps. Separating these out helps reduce “noisy” differences in version control systems when the app is saved multiple times without significant functional changes. It also holds other files that don’t fit neatly into the other categories, such as what might be in \references.

Most of the logical code changes will be done in the ‘src’ folder.

This is especially helpful when you want to make bulk changes to the file.

Once the changes are done, you can save them locally for next step.

Repack

For repacking we follow the same unpacking process but in reverse order.

Basic steps will involve

• Navigate to the parent directory of your unpacked app’s source folder in terminal.
• Execute the pac canvas pack Command
  • The core of repacking is the pac canvas pack command. This command tells the PAC CLI to take the specified source directory and compile it back into an .msapp file.This can be accomplished by using below commandpac canvas pack –msapp <outputPath>\<YourAppName>.msapp –sources <sourceDirectory>
  • Here:
    •  <outputPath>: This is the directory where you want the new .msapp file to be saved. It can be the current directory (.) or a specific path like C:\PowerApps\PackedApps.
    • <YourAppName>.msapp: This is the desired filename for your repacked app. It’s often a good idea to append a version number or _repacked to distinguish it from the original.
    • –sources <sourceDirectory>:
    • <sourceDirectory>: This is the path to the root folder of your unpacked app’s source code. In our example, it would be MyPowerApp_Source.

• Example:

This generates a MSAPP file which can then be imported like any other MSAPP file for important Power Platform artifacts.

The imported artifacts (forms, etc.) will now contain the changes you made manually.

As a best practice, keep an eye out on the ‘App Checker’ output. In case of any formula, performance or runtime errors which might have crept in due to the manual changes will be showcased directly. These then can be manually solved or the above process can be rerun to update these changes.

Watch Out & Best Practices!

Manually updating an .msapp file (by unpacking it, modifying the source files, and then repacking it) can be a powerful technique for advanced scenarios like bulk updates, version control, or advanced debugging. However, it comes with significant risks and is not officially supported by Microsoft as a general practice.

Here are some critical precautions and best practices to take if you choose to manually update an .msapp file:

1. Understand the Risks (Unsupported Operation):

• No Official Support: Microsoft does not officially support direct manual manipulation of .msapp files. This means if you encounter issues, you might not get official support for them.
• Breaking Changes: The internal structure of .msapp files and the Power Fx language can change with Power Apps updates. Manual edits might become incompatible or break your app with future updates to the Power Platform.
• Corrupted Apps: Incorrect edits can easily corrupt the .msapp file, making it impossible to open in Power Apps Studio or causing unexpected behavior at runtime.

2. Always Have Backups:

• Before Unpacking: Always save a backup copy of your original .msapp file before you even start the unpacking process.
• Before Repacking: Before repacking, ensure you have a copy of the unpacked source files in case something goes wrong during repacking.
• Version Control: For any serious manual editing, use a version control system (like Git) to track changes. This allows you to easily revert to a previous working state if your edits break the app.

3. Use the Power Platform CLI (pac canvas unpack/pack):

• Essential Tool: This is the only reliable way to unpack and pack .msapp files for manual editing. Do not simply rename the .msapp to .zip and try to extract it; this will likely lead to errors when repacking.
• pac canvas unpack: Unpacks the .msapp into a human-readable folder structure.
• pac canvas pack: Packs the modified source files back into an .msapp file.

4. Focus on *.fx.yaml files:

• Primary Edit Location: The *.fx.yaml files within the \src folder are where the Power Fx formulas are stored. This is typically where you’ll make most of your manual edits.
• YAML Syntax: Be extremely careful with YAML syntax (indentation, spacing, colons). Incorrect YAML can easily break the parsing process and lead to app errors.
• Power Fx Syntax: Ensure any Power Fx changes you make are syntactically correct and follow Power Fx rules.

5. Avoid Unnecessary Edits to Other Files:

• CanvasManifest.json: This file contains critical app metadata. Only modify it if you fully understand the implications.
• .json files (raw control definitions): These files are highly complex and prone to breaking if manually edited incorrectly. Avoid them unless you have a deep understanding of their structure.
• EditorState*.editorstate.json and entropy.json: These files contain cached or volatile information. It’s often safe to delete EditorState files if you encounter issues, as Power Apps Studio will regenerate them. entropy.json helps reduce “noise” in version control and usually doesn’t need manual editing.
• DataSources and Connections: Modifying these manually is very risky. If you need to change data source details (e.g., for different environments), consider using Power Platform environment variables which are designed for this purpose.

6. Test Thoroughly:

• After Every Pack: Every time you pack the modified source into an .msapp file, immediately try to import it into Power Apps Studio and open it.
• Test Functionality: After opening, thoroughly test all aspects of the app that you might have impacted with your changes, as well as critical untouched functionality, to ensure nothing was inadvertently broken.
• Test in Different Environments: If you’re using this for deployment, test the repacked app in your target environments (e.g., UAT, Production).

7. Use a Good Text Editor with YAML Support:

• Visual Studio Code: Highly recommended. Install extensions for YAML language support (e.g., by Red Hat) and potentially a Power Fx extension for syntax highlighting. This helps catch syntax errors before repacking.

By following these precautions, you can mitigate some of the risks associated with manual .msapp file editing. However, always remember that it’s an advanced, unsupported operation and should be approached with extreme caution.

Conclusion

In conclusion, manually unpacking and editing .msapp files offers a powerful alternative for pro-code developers and advanced Power Platform users who are familiar with the internal structure of Canvas Apps. This method can significantly speed up development, especially when the Power Apps Studio becomes sluggish for larger or more complex apps. By using familiar IDEs, version control systems, and automation scripts, developers can streamline their workflow and unlock capabilities not easily accessible through the visual editor.

However, this approach should be used with caution—modifying internal files incorrectly can corrupt the app or introduce subtle bugs. It’s a best-fit option for those who understand the platform’s architecture and are comfortable working under the hood. Always back up your app and test thoroughly before repackaging and deploying.