App Build Size

The build size of MiniApp is strictly limited to 1M, this is a consideration of experience when users sync our app.

Single WebSocket connection

We’re able to have only single connection through WebSocket, make sure we’re making good use of it.

Uni-directional Data Flow

WeChat MiniApp was highly inspired by ReactNative, which is a abstraction/bridge of iOS/Android native code. As a matter of component lifecycle management, developers couldn’t be able to change the states inside the Page directly by using assignment statements, but only setData() way.

Event Handling

There’s also only one way to deal with events in MiniApp, for example, you want to get user’s input from a form.

<input id=”myInput” bindblur=”onBlur” />
var inputContent = {};
data: {
inputContent: {}
onBlur: function(e) {
inputContent[] = e.detail.value

Think in “JsCore”

Unlike typical Web development, we’re not dealing with Chrome or Safari, MiniApp’s using JsCore to compile & excute javascript code. And that leads to a result of we wouldn’t be able to use jQuery or Zepto and staff like that, because there’s no window or document object in the context.

Opening pages amount limited

I think neither they nor we likes having a deep route stack in Modern Apps, so MiniApp limited 5 pages opening at the same time(opened with wx.navigateTo).

Selectors missing in WXSS

WXSS is basically a varient of CSS but extended something(rpx, import) and dropped something for example, selectors like >, ~:hover:focus:first-child:last-child are not your friends anymore.

Say goodbye to local assets

Just like ReactNative, background-image could not access local resources using url(./sample.png), we’re only able to achive this by encoding images into base64 or uploading them to CDN.

Pre-defined HTTP Referer

HTTP Referer has been statically pre-defined by MiniApp as:{appid}/{version}/page-frame.html

Native Components

Native components will not regard any z-index in MiniApp, so they’ll always lay on top of the view, here’s an short list of them: map, canvas, video, textarea. Try not to cover anything upon them.