---
title: Running Mechanism of Pages
---

# Running Mechanism of Pages

When a miniapp starts, all pages are registered in the logic layer. They will be instantiated when routed to a specific page. In the startup phase (or in case of a route change), the application lifecycle and the page lifecycle are triggered.

## Page lifecycle

The miniapp consists of two parts: the view layer and the logic layer. The view layer and logic layer run concurrently.

- After the application logic layer starts, run `app.onLaunch` and `app.onShow` to complete the app creation. And then, run `page.onLoad` and `page.onShow` to complete the page creation. Wait until the view layer is initialized, and send a notification to start running.
- Notify the logic layer after the view layer is initialized. The logic layer sends the initialization data to the view layer for rendering. Now, the view layer completes the first data rendering.
- After the first rendering is completed, the view layer enters the ready state and notifies the logic layer. The logic layer calls the `page.onReady` function and enters the active state.
- After the logic layer becomes active, the view layer is notified to render each time the data is modified. To switch the page to the background, the logic layer calls the `page.onHide` function, so the page is running in the background. To switch the page back to the foreground, the `page.onShow` function is called, so the page becomes active. To navigate from the page to the previous page or another page, the `page.onUnload` function is called to terminate the page.

> For more information about the `Page` lifecycle, see [Page](/en/miniapp/develop/miniapp/framework/api/page).

The following figure shows the process relationship between the view layer and the logic layer, as well as the triggering sequence of the page lifecycle when `Page` is instantiated.

<Image src="/images/framework/detail.en-US.png"/>

> You can dive deep into the above figure during actual development.
