Applet early stage of development experience

Applet appears for so long, there has been no opportunity to further contacts, with the recent project requires a small program development. The first is the official document read through it.

 

We can learn from the document, applet development different from the previous web development. Applet is based on the dual-threaded mode, the operating environment into render layer (s) and logical layer (a), the communication between the two client thread by a micro-channel (Native) do transit, logical layer also forwarded by the network request Native .

 

communication

Rendering and logical layers through setData communications, asynchronous data call this.setData will be passed to the rendering layer , a certain degree of consumption. Combine multiple setData, js reduced compiler implementation; the same amount of data should not be too large. When the page into the background, setData will also seize the execution of the front page, back page and therefore should not have the setData operation.

 

Library on the basis of
the rendering layer injection layer is referred WebView WebView base library, referred to as a logical layer injection AppService base libraries, client built in the micro channel 

 

Logical layer

Logical layer frame based on the JavaScript, core data binding system response, with the view to the data can be synchronized very simple (and similar popular response frame).

App entire applet is only one example, you may be) obtained by getApp (to this example, to add global data.

 

Page life cycle

 

 

Routing page

Applet all pages by routing framework to manage, maintain all pages in the form of framework stack.

Each open a new page will create a webview, in order to prevent excessive memory consumption, and therefore can store up to 10 pages , will lead to more than a page creation failed.

When the page stack is not full, each new page will be opened webview preload, shorten time to show the new page.

You can use getCurrentPages () Gets the current page stack.

navigateTo, redirectTo only open non tabBar page, navigateTo will add a new page to page stack while the stack redirectTo the current page, a new page stack.

switchTab 只能打开 tabBar 页面,当 Tab 切换时,清空原有的页面栈,并销毁栈内除已声明的 Tabbar 页的其他页面,即 Tabbar 页初始化之后不会被销毁,但是页面栈中只留下新的 Tab 页面。

切换页面可能会存在延迟,最好做跳转节流处理

 

关于样式
组件不受外部组件样式控制

background 不能引用本地资源,但可以转为 base64 后访问

 

关于 API
wx:小程序宿主环境提供的全局对象
几乎所有小程序的 API 对挂载在 wx 对象下(除了 Page/App 等特殊构造器)
大多是异步

 

关于事件

事件分为冒泡事件、非冒泡事件,catch、capture-catch 事件会阻止后续事件的触发

 

原生组件
webview 仅渲染一个占位元素,客户端在这块占位元素上叠一层原生界面。因此原生组件层级比所有 webview 渲染的组件高。


原生组件脱离在WebView渲染流程外,带来最主要的限制是一些CSS样式无法应用于原生组件,例如,不能在父级节点使用overflow:hidden来裁剪原生组件的显示区域;不能使用transformrotate让原生组件产生旋转等。

最为常见的问题是,原生组件会浮于页面其他组件之上(相当于拥有正无穷大的z-index值)使其它组件不能覆盖在原生组件上展示。想要解决这个问题,可以考虑使用cover-view和cover-image组件。这两个组件也是原生组件,同样是脱离WebView的渲染流程外,而原生组件之间的层级就可以按照一定的规则控制。

 

关于启动及更新

启动分为热启动、冷启动。每次冷启动都会检查是否有更新版本,如果有,异步下载新版本代码包,并同时启动客户端本地的包,因此新版本在下次冷启动才会启用,可以使用 wx.getUpdateManager API 进行更新处理。

 

Guess you like

Origin www.cnblogs.com/xxhuan/p/10927795.html