1# JS Widget Overview 2<!--Kit: Form Kit--> 3<!--Subsystem: Ability--> 4<!--Owner: @cx983299475--> 5<!--Designer: @xueyulong--> 6<!--Tester: @chenmingze--> 7<!--Adviser: @Brilliantry_Rui--> 8 9JS widgets, developed using a web-like paradigm (HML + CSS + JSON), now support two [application models](../application-models/application-models.md): the FA model and the stage model. For details, see [Developing a JS Widget (Stage Model)](js-ui-widget-development.md) and [Developing a JS Widget (FA Model)](widget-development-fa.md). When developing a new widget, you are advised to use the ArkTS declarative syntax to build UIs. For details about the differences between the declarative paradigm and web-like paradigm, see [Introduction to ArkUI](../ui/arkui-overview.md). 10 11## How to Implement 12 13Below shows the working principles of a JS widget. 14 15**Figure 1** Working principles 16 17 18 19The widget host consists of the following modules: 20 21- Widget usage: provides operations such as creating, deleting, or updating a widget. 22 23- Communication adapter: provided by the SDK for communication with the Widget Manager. It sends widget-related operations to the Widget Manager. 24 25The Widget Manager consists of the following modules: 26 27- Periodic update: starts a scheduled task based on the update policy to periodically update a widget after it is added to the Widget Manager. 28 29- Cache manager: caches view information of a widget after it is added to the Widget Manager. This enables the cached data to be directly returned when the widget is obtained next time, greatly reducing the latency. 30 31- Lifecycle manager: suspends update when a widget is switched to the background or is blocked, and updates and/or clears widget data during upgrade and deletion. 32 33- Object manager: manages RPC objects of the widget host. It is used to verify requests from the widget host and process callbacks after the widget update. 34 35- Communication adapter: communicates with the widget host and provider through RPCs. 36 37The widget provider consists of the following modules: 38 39- Widget service: implemented by the widget provider developer to process requests on widget creation, update, and deletion, and to provide corresponding widget services. 40 41- Instance manager: implemented by the widget provider developer for persistent management of widget instances allocated by the Widget Manager. 42 43- Communication adapter: provided by the SDK for communication with the Widget Manager. It pushes update data to the Widget Manager. 44 45> **NOTE** 46> 47> You only need to develop the widget provider. The system automatically handles the work of the widget host and Widget Manager. 48
