Frontend Development 10 min read

Introduction to Baidu Smart Mini‑Program and VR Component Development

Baidu smart mini‑programs let developers embed low‑cost VR components—such as panoramic video, image, 3‑D ring and model viewers—into apps via dynamic libraries, supporting live streaming, education and marketing use cases, while Baidu’s rendering engine and upcoming 5G bandwidth aim to broaden immersive experiences.

Baidu App Technology
Baidu App Technology
Baidu App Technology
Introduction to Baidu Smart Mini‑Program and VR Component Development

Baidu smart mini‑programs are low‑cost, instantly accessible applications that run inside the Baidu mobile app. With the rapid growth of Virtual Reality (VR) technology, Baidu has explored VR integration and provides a set of VR mini‑program components.

1. Overview of Baidu Smart Mini‑Program

Smart mini‑programs consist of standard web assets (HTML/CSS/JS) and custom components that abstract functional modules for code reuse. Baidu’s self‑developed rendering engine delivers near‑native performance and offers a variety of intelligent components such as voice, vision, natural‑language, AR, and VR.

The custom smart‑program component package includes several files (illustrated in the original diagram) and can be extended with user‑defined components, for example a simple view component.

2. Development Process

Developers create a mini‑program using Baidu’s development tools, publish it, and the package is uploaded to Baidu’s backend servers for review. After approval, the program is delivered to end‑users via encrypted transmission and rendered by the Baidu app.

To use Baidu’s intelligent components, developers typically import a dynamic library, configure it, and then invoke it in the mini‑program code:

A. Import dynamic library

app.json:
"dynamicLib": { "myDynamicLib": { "provider": "vrvideo" } },

B. Configure dynamic library

xxx.json:
{ "usingSwanComponents": { "vrvideo": "dynamicLib://myDynamicLib/vrvideo" } }

C. Use the component

xxx.swan:

3. Baidu VR Mini‑Program Components

The VR component suite provides four functional components:

vrvideo : panoramic video playback

panoviewer : panoramic image viewer

spintileviewer : 3‑D ring (spin‑tile) viewer

modelviewer : 3‑D model viewer

Each component follows a similar usage pattern. Below are the code snippets for the remaining components.

Panoramic Image Component

app.json:
"dynamicLib": { "myDynamicLib": { "provider": "panoviewer" } },
xxx.json:
{ "usingSwanComponents": { "panoviewer": "dynamicLib://myDynamicLib/panoviewer" } }
xxx.swan:

3‑D Ring Component

xxx.swan:

3‑D Model Component

xxx.swan:

Supported attributes include projection modes, interaction methods (gesture, gyroscope), playback controls, decoding options, and display modes for video; projection types, interaction, and rotation settings for images; angle ranges and hotspot support for ring and model viewers.

4. VR + Live Streaming

Integrating VR with live streaming enhances immersion, allowing viewers to actively participate. Baidu’s VR live‑streaming architecture (illustrated in the source) uses 180°/360° VR cameras capable of up to 4K @ 30 fps capture. Sample frames from a 180° VR camera are shown.

5. VR + Education

Baidu VR Classroom offers a solution for schools, supporting PC‑VR and all‑in‑one headsets, providing hardware, a teaching‑management system, and VR course content to create immersive learning experiences.

6. VR + Marketing

The VR marketing platform consists of three stages—capture, processing, and display—and supports 3‑D ring objects, panoramic media, and 3‑D models. Real‑world marketing scenarios are demonstrated in the original diagrams.

7. Conclusion

Although VR technology has advanced rapidly, high production costs and bandwidth limitations restrict widespread UGC adoption. With the rollout of gigabit networks, 5G, and more powerful hardware, higher‑resolution (e.g., 8K) VR experiences are expected to become mainstream, and Baidu’s VR mini‑programs will continue to empower developers.

Front-End DevelopmentVRBaidu Mini ProgramSmart ComponentsWebVR
Baidu App Technology
Written by

Baidu App Technology

Official Baidu App Tech Account

0 followers
Reader feedback

How this landed with the community

login Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.