# 概述 兼容JSçš„ç±»Webå¼€å‘范å¼çš„方舟开å‘框架,采用ç»å…¸çš„HMLã€CSSã€JavaScript三段å¼å¼€å‘æ–¹å¼ã€‚使用HMLæ ‡ç¾æ–‡ä»¶è¿›è¡Œå¸ƒå±€æ建,使用CSSæ–‡ä»¶è¿›è¡Œæ ·å¼æ述,使用JavaScript文件进行逻辑处ç†ã€‚UI组件与数æ®ä¹‹é—´é€šè¿‡å•å‘æ•°æ®ç»‘定的方å¼å»ºç«‹å…³è”,当数æ®å‘生å˜åŒ–时,UIç•Œé¢è‡ªåŠ¨è§¦å‘更新。æ¤ç§å¼€å‘æ–¹å¼ï¼Œæ›´æŽ¥è¿‘Webå‰ç«¯å¼€å‘è€…çš„ä½¿ç”¨ä¹ æƒ¯ï¼Œå¿«é€Ÿå°†å·²æœ‰çš„Webåº”ç”¨æ”¹é€ æˆæ–¹èˆŸå¼€å‘框架应用。主è¦é€‚用于界é¢è¾ƒä¸ºç®€å•çš„ä¸å°åž‹åº”用开å‘。 请å‚考[兼容JSçš„ç±»Webå¼€å‘范å¼API](../reference/apis-arkui/arkui-js/js-components-common-attributes.md)文档,全é¢åœ°äº†è§£ç»„件,更好地开å‘应用。 ## 整体架构 兼容JSçš„ç±»Webå¼€å‘范å¼çš„方舟开å‘框架,包括应用层(Application)ã€å‰ç«¯æ¡†æž¶å±‚(Framework)ã€å¼•æ“Žå±‚(Engine)和平å°é€‚é…层(Porting Layer)。  - **Application** 应用层表示开å‘者开å‘çš„FA应用,这里的FA应用特指JS FA应用。 - **Framework** å‰ç«¯æ¡†æž¶å±‚主è¦å®Œæˆå‰ç«¯é¡µé¢è§£æžï¼Œå¹¶æä¾›MVVM(Model-View-ViewModel)开å‘模å¼ã€é¡µé¢è·¯ç”±æœºåˆ¶å’Œè‡ªå®šä¹‰ç»„件ç‰èƒ½åŠ›ã€‚ - **Engine** 引擎层主è¦æ供动画解æžã€DOM(Document Object Modelï¼‰æ ‘æž„å»ºã€å¸ƒå±€è®¡ç®—ã€æ¸²æŸ“命令构建与绘制ã€äº‹ä»¶ç®¡ç†ç‰èƒ½åŠ›ã€‚ - **Porting Layer** 适é…层主è¦å¯¹å¹³å°å±‚进行抽象,æ供抽象接å£ï¼Œå¯ä»¥å¯¹æŽ¥åˆ°ç³»ç»Ÿå¹³å°ã€‚比如:事件对接ã€æ¸²æŸ“管线对接和系统生命周期对接ç‰ã€‚