How Dynamics 365 Power Apps Portal Page generated and displayed (rendered) in a browser?

 A picture is worth a thousand words!

 I captured below picture while going through learning videos from Microsoft learn site and luckily on the same day while discussing about the portal with my friend it helped me to show case the things I understood about the portals and how Dynamics 365 Power Apps Portal web page content actually gets generated and displayed or rendered in a client browser.

 

So thought to save it in my notes

 Dynamics 365 Power Apps Portal Page generated

Let us see how this page can be generated on the fly by Dynamics 365 Portals having  both static and dynamic content using Common Data Service data.

 

1. When a request is received, we know the Website.
   The Website has a "Header Template" and a "Footer Template".
   This is sufficient for the engine to generate the "Header".
   Then the Web Page is retrieved.

 

2. Web Page has a lot of properties describing all the different moving parts of the page.
   The most important one is the "Page Template".
   The "Page Template" is used to retrieve a template, in this case, a Web Template.
   The Web Template is parsed and the processing starts.
   It goes line by line and generates content as it goes.

 

3. The first one has a subtemplate "Breadcrumbs" which knows how to generate breadcrumbs using the hierarchical structure where the page is located in the hierarchy.
   The next one is "Page Header" which uses the "Title" from the "Content" on the Web Page.It generates the header or the title of the page.
   It then uses "Page Copy" which is HTML, and places this HTML on the page.

 

4. The next one is interesting because it includes dynamic data.
   It points to the "Entity List" that is defined on our Web Page.
   This "Entity List" contains the definition of which entity to go to and which view to use.
   In this instance, we use the "Active Contacts" view from our Contacts entity.
   It describes layout and it has the data.This information is sufficient to generate the list view on the page and render it.

 

5. Next, an "entity form" is used and it points to the "Entity Form" defined on the Web Page. This "Entity Form" is slightly different.
   It does not use Contacts, it uses Leads.

So, it takes this form from the Lead and generate the form on the Web Page.
And that is exactly what happens. The form with the "Submit" button is generated.

 

6. Finally, the Web Footer is extracted and generated and the page generation is complete.

Courtesy - Microsoft Learn !!