How to Enable On‑Device AI in WeChat Mini‑Programs with TensorFlow.js and Native Inference

Background

With the AI wave, the vivo+云店 project applied on‑device intelligence to personalize product recommendations in a WeChat mini‑program, achieving a 30% increase in click‑through rate.

Technical Selection

Two feasible inference solutions were evaluated:

TensorFlow.js inference (Google) – minimum base library 2.7.3, complex integration.

WeChat native inference (WeChat) – minimum base library 2.30.0, simple integration.

Project Integration

Both solutions were adopted; the article walks through integration steps, model conversion, handling package‑size limits, and provides code examples.

Model Processing

The trained recommendation model is saved as a TensorFlow SavedModel and must be converted:

TensorFlow.js format:

tensorflowjs_converter --input_format=keras_saved_model output output/tfjs_model

ONNX format for native inference:

python -m tf2onnx.convert --saved-model output --output output/model.onnx

Converted models are uploaded to a static server and fetched at runtime; they are periodically retrained and updated via a backend API.

TensorFlow.js Integration

Install the tfjs plugin in the mini‑program, add dependencies (tfjs‑core, tfjs‑layers, tfjs‑backend‑webgl, fetch‑wechat), initialize the plugin, and mitigate the 2 MB package limit by extracting the dependencies into an asynchronous sub‑package.

const plugin = requirePlugin('tfjsPlugin')
plugin.configPlugin({
  fetchFunc: fetchWechat.fetchFunc(),
  tf,
  webgl,
  canvas: wx.createOffscreenCanvas()
})

Model loading and inference use loadLayersModel and predict methods.

WeChat Native Inference Integration

No extra dependencies are required; the ONNX model is downloaded with wx.downloadFile, cached locally, and an inference session is created via wx.createInferenceSession. Inference runs by calling session.run with prepared input tensors.

load() {
  const modelPath = `${wx.env.USER_DATA_PATH}/${this.modelName}.onnx`;
  // check cache, download if needed, then create session
}

Combined Usage

The app first attempts WeChat native inference (if the base library supports it); otherwise it falls back to TensorFlow.js. This hybrid approach covers over 90% of users while preserving a good development experience.

Performance Evaluation

Average latency (ms) measured after launch:

TensorFlow.js: init 321, run 252, sub‑package load 971, total 1544.

WeChat native: init 531, run 19, sub‑package load 0, total 550.

Native inference is faster, but TensorFlow.js offers broader version compatibility and local debugging.

Conclusion

The article provides a complete engineering solution for on‑device AI in WeChat mini‑programs, covering model format conversion, package‑size optimization, dual‑scheme integration, performance monitoring, and a hybrid strategy that improves recommendation effectiveness.