knowledgecenter-breadcrum

Knowledge Center

02 Jul, 2022

PCF Tips & Tricks: Tips to minimize the size of your PCF components.

Posted on 02 Jul, 2022 by Admin, Posted in Dynamics 365 PCF (PowerApps Component Framework) Power Platform

PCF Tips & Tricks: Tips to minimize the size of your PCF components. Blogs

PCF Tips & Tricks: Tips to minimize the size of your PCF components.

Introduction

Recently we were working on a PCF control using Fluent UI, everything was fine at the development stage, but when we tried to import it into CRM it says its too heavy.

 

Solution

Tip 1 – Use only what is required.

You have to take care of few things while you are importing FluentUI controls in your index.ts of PCF control.

You should be importing the controls in granular fashion – ie. import only needed controls. Otherwise bundle.js size will be huge. Import the necessary controls using @fluentui/react/lib/… rather than the whole @fluentui/react.

File size when importing the whole using @fluentui/react.

File size when importing the necessary controls using @fluentui/react/lib/.

Tip 2 – use production mode

We can build a component in ‘production(i.e. minified)’ mode just using a single line of code.

When the control is ready and you want to push it to the CDS environment open *.pcfproj file and look for the following part of the file:

Add the line production to turn it to:

Save the file and use pac pcf push command to import your component to CDS. So here is what happened to the size of bundle.js:

Comment

This is a Required Field

Loading

Recent Updates

Blogs
07 Sep, 2023

Optimizing Storage with SubscriptionTrackingDeletedObject Cleanup

What is SubscriptionTrackingDeletedObject? The "SubscriptionTrackingDeletedObject" table is linked to the "DeletionService," which handles two types of cleanup: organization-wide and record-specific.…

READ MORE
Blogs
05 Sep, 2023

How to create real-time customer journeys in Dynamics 365 Marketing

Introduction: This blog will show how to create real-time customer journeys in Dynamics 365 Marketing. Customer journeys can be either…

READ MORE
Blogs
30 Aug, 2023

D365 CUSTOMER SERVICE: CUSTOMER 360 COMPONENT

Introduction: In Dynamics 365 (D365) Customer Service, the 'Customer 360' Component provides a comprehensive view of information and enables users…

READ MORE