Large-scale application of Taobao widgets in 2021 Double Eleven

Author: Chino

1 review: Taobao widget: brand new open card technology!

On Double Eleven in 2021, Taobao's new open form "widget" made its debut in the big promotion, and supports the initial scale of open business; speaking of widgets, let's review the past and present life of Taobao's small program opening.

The past and present life of Mini Program opening

From page-level opening to module-level opening

The essence of Taobao's open business is to help merchants complete better business operations in Taobao and provide excellent consumer experience by uniting the power of the three-party open ecosystem. Facing the pursuit of merchants with a high degree of openness and customization, strong business data synergy, and more efficient operation links, our exploration of open technologies is never-ending.

In the past, we provided the capability of mini-programs, breaking the boundaries and divisions between H5 pages, and merchants could deeply manage their own consumers; in this process, we leveraged the mature industry ecology of mini-programs and perfect engineering infrastructure, We support the development of our own business through the form of independent pages, such as shopping mini-programs, Taojimu advertisements, etc.

Later, we cooperated with the store team to help the store introduce 100+ ISVs and thousands of designers through the opening of plug-ins based on the mini-program environment, providing differentiated marketing capabilities for tens of thousands of brands and merchants. This set of technology is naturally a technical solution with a small program plug-in as the core, and it is also a small program environment + a small program standard; the small program plug-in of the main position of the merchant’s self-operated store, and the upgrade of the Wangpu platform, makes the store a highly modular module for merchants The core business position of customized customization, personalized operation, and differentiated undertaking of public domain.

Later, we found that although the mini-program technology has brought about the unification of business resources and a huge improvement in utilization, the nature of the independent form of mini-programs limits our pursuit. There will naturally be a game between the independent page form of the applet and the efficiency of consumer traffic acceptance. This includes the reasons for the bounce rate of user clicks, the reason why the entire consumer access path is too long, and the lack of consumer front-end mentality. reason.

For various reasons, based on years of technical accumulation and precipitation in Mini Programs, we launched the Widget Open Project.

widget is essentially an open module investment technology, 161ee5c8a60060 through widgets, we can put business in various business scenarios that are not small program environments, such as details, search, first guess, subscription, etc., of course Also available in stores.

The relationship between widgets and applets

The sister form of the applet

What is the relationship between widgets and applets?

a nutshell, widgets are the sister form of applets.

In the past, based on years of technical accumulation and precipitation in Mini Programs, we precipitated the Mini Program platform, which is the core system platform of Mini Programs/Mini Programs and the cornerstone of the Mini Program system, providing the most basic and stable operation services and data capabilities ;

Behind the open capabilities used by developers, we also have a basic platform for many capabilities. The open platform provides a large number of basic capabilities that can be used and applied; in the applet, we have accumulated a mature developer tool system, including IDE, Builder and other one-stop engineering tools; in addition, we have developed an efficient and lightweight Weex2.0 rendering kernel in the horizontal direction. Through the upgrade and polishing of the rendering kernel, we have made Weex2.0 a widget rendering tool. The core foundation; in addition, we have a batch of Taobao-specific APIs and basic API capabilities accumulated under the applet, and these APIs can be seamlessly used by our developers under the widget; in addition, we have and the applet The program isomorphic business container and the stable and isolated business container allow us to efficiently promote the operation of widget-related business under a safe water level.

In addition to the basic capabilities of these platforms, we also have fresh ideas from advertising companies and brands. Through the combination of ideas and ecological cooperation, we provide nourishment for the business; in addition, there are input from the open source community, and robust engineering supporting it. system.

Standing on the shoulders of these giants, through the combination of these production factors, we have hatched a new open form outside the applet: widgets.

Through the three-layer opening of standards, capabilities, and scenarios, widgets have released a new round of technological dividends; we have continued to standardize the use of open capabilities and the complete technology access process, and improved the ecological revenue-generating space through the opening of new scenarios.

On the business side, we hope that the widgets can leverage the business mind of the business, and ultimately improve the business link effect of the business, and be responsible for the business effect of the business.

what are widgets

A new form of Taobao's opening, a card-level open plan

So, back to widgets, what are widgets?

widget is a new form of Taobao's opening, and it is our module-level open solution.

Developers and designers in the widget ecosystem can enter the widget production process through our front-end business (LiveCard/pre-card), and use our open tools such as Taobao developer tools or game engine IDE to produce their own widgets. materials, and then connect the developer's own cloud through our cloud function/cloud application to realize the closed loop of business logic research and development.

After the developer of the widget has finished producing the material, it will be delivered through our complex delivery system; here, the platform will have some regular detection and constraint mechanisms to ensure the efficiency of circulation. For different scenarios, developers can develop different Widgets are used to adapt to the scene and the business rules of the scene. In addition, there is also some relational storage of configuration data for the delivery side. Finally, these business data will be displayed in the form of a report on the front desk of the merchant; Including consumer clicks on PV, UV, as well as guided transaction data, etc.

After the delivery operation is completed, the widget will be rendered in the foreground business scene, and the technical details here will be very complicated. Because in different scenarios, multiple scenario containers will be involved, including PHA, Weex|DX, applet, etc., so we need to directly embed them in the foreground scenario in some ways. Then the runtime will dynamically pull the corresponding JS package and execute it. This logic will also be very complicated. At the widget container level, we will unify meta information, basic library capabilities, life cycle and other capabilities; some capabilities and applet containers is directly public. Finally, the JS code will be passed to the kernel of the widget, that is, the Weex2.0 kernel. The Weex2.0 kernel includes our self-developed scripting engine, graphics engine and rendering engine. The kernel is mainly responsible for executing logic and providing rendering implementation. Through the cross-platform rendering consistency capability provided by Weex2.0, we can achieve almost the same style and animation capabilities on iOS/Android, and also ensure that the developer's code can be Render both ends seamlessly.

Finally, there is our support platform. Through the horizontal support of the open platform, the applet platform, and the Xiaoer operation platform, and the cooperation of the above-mentioned production side, delivery side, and operation side, we can deliver the supply of widgets to private domain scenarios. This includes shop, details, search, first guess, subscription, etc. For these scenarios, we can provide the top card supply, as well as commodity cards, interactive cards, applet cards, content cards, rights cards, 3D cards, etc. Wait.

For the detailed technical introduction of widgets, you can refer to the author's previous article: Taobao widgets: brand new open card technology!

What problems can widgets help businesses solve?

So back to a business proposition, what problems can widgets help businesses solve?

Let's take a shop as an example.

First of all, let's review the strategy of the store's opening business this year. The store has re-upgraded the strategy of opening its business this year, mainly for three key words.

1. The first is "Expression Mode Upgrade", the store module is upgraded to LiveCard, and is combined into MiniShop, Daily Good Store, etc. through multiple LiveCards;
2. The second key word is "open mode upgrade". Through the three dimensions of visual openness, functional openness and application openness, it can be expressed as the front desk of the business in the form of card combination;
3. The third keyword is "content supply upgrade". In the past, most of the modules in the store were mainly commodity shelf cards, and there were relatively few content-based modules. Through the upgrade of content supply, the rich developer ecology and powerful widgets were used. With the interactive pre-positioning capability, we can directly pre-position interactive games in the store module.

just right, and the technical system of widgets perfectly fits the idea of store business upgrading.

A LiveCard module developed by the developer can be circulated to the details page after the store is renovated, and the experience on the details page is exactly the same as the experience on the home page of the store. Of course, the details here are just one of the scenarios. Through LiveCard, the store can expand from simple shelf cards to single-product, recommendation, rights, interaction, content, applet and other types of cards, enriching the card supply for each scene, satisfying The diversified business demands of merchants can maximize the productivity of merchants.

The use of widgets in stores can realize the unification of merchant value and platform value. Businesses can use widgets to accumulate their own merchant assets, and make structural precipitation and utilization. Merchants can obtain experience consistency and greater experience through widgets in the store. Open space is used for in-depth customization of our own stores. For our ecology, developers in the ecology can obtain revenue-generating space with multiple scenarios and multiple tracks, helping developers to obtain business value in more business scenarios.

Large-scale application of widgets in Double 11: store scene

Bring richer scene experience and stronger innovation creativity to business private domain

Taobao widget made its debut on the Double Eleven stage. In the big promotion, the total number of merchants covered is 300+, involving multiple core KA and SKA merchants, and the peak consumer exposure at the front desk is PV 1900W+ and UV 470W+.

• LiveCard in 98 stores on Double Eleven, involving custom widgets from multiple KA/SKA brands and template widgets for a large number of waist merchants;
• Help merchants on the platform LiveCard , and successfully acquire customers during the promotion period.

Large-scale application of widgets in Double 11: Membership scenarios

Help Nike create a customized benchmarking project for brand members and improve the efficiency of member operations

1. Supported the Tmall industry's top customization project "Wildwood" to officially launch the membership pages of the three flagship stores of Nike, Jordan and Nike Kids. The overall project is the "Nike Membership Advanced Plan". The project fully uses the complex interactive capabilities of widgets and connects them in series. The mini program behind it increases the in-depth experience; the overall consumer return visit rate and stay time are higher than the water level of the broader market;
2. Nike uses widgets to introduce a series of highly personalized, interesting and in-depth member interactions, and this member advanced program optimizes the membership experience for Chinese consumers.

Technical challenges encountered by widgets

Open business has distinct business characteristics that are obviously different from other businesses. These business characteristics have brought brand new technical challenges to widgets on Double Eleven this year.

Short delivery time:

1. ISVs usually have insufficient time for development and testing, the delivery period is compressed by the project launch time, and the ability to strictly test cycle is lacking
2. ISVs vary in level and quality, project delivery levels are not specific, and best practice guidance is lacking

Uncontrollable online:

1. Merchant's private domain business launch time is free and uncontrollable, lacking single-service granularity monitoring and operation and maintenance capabilities
2. Merchant private domain business release decoration is full volume, lack of grayscale mechanism

Rollback is difficult:

1. Merchants cannot cover the cost of rolling back/downgrade after encountering problems after going online, and there is a risk of complaints
2. The business expectations of merchants/brands have always been relatively clear, usually need to cooperate with the pace of business operation, generally not easy to roll back

These significant business characteristics have brought some difficult challenges to our Double Eleven. The huge number of developer submissions and merchant release processes made us experience alarms, rollbacks, investigations, repairs, and releases during Double Eleven. Multiple rounds of testing. On the premise of not affecting the core experience of the merchant's brand, we and the developers have gone through multiple rounds of troubleshooting and the process of repairing and launching.

Combining our business characteristics and some problems during Double Eleven, we summarize the biggest challenges and bottlenecks of widgets at present, and we are also seeking solutions in pain:

First, stability challenges: mainly a global stability risk caused by the lack of kernel maturity of widgets. At present, the kernel (Unicorn) of widgets is still under rapid iteration, and a large number of functional requirements and optimization strategies are also being developed in parallel ;In the process of rapid iteration, stability will inevitably be challenged. There is a contradiction between the high requirements of business scenarios for stability and the rapid iteration of technology; for the problem of stability challenges, we will continue to build the stability of the kernel later. To improve the stability, together with the kernel team, we regard stability construction as the most important technical goal of widgets; strive to consolidate the basic skills of the kernel, and make progress towards the goal of a lightweight, modern, and high-performance rendering engine;

Second, syntax capabilities: widget style syntax restrictions are still relatively strict, mainly reflected in some restricted CSS style capabilities and data protocol declarations; compared to the syntax of the applet/web system, some syntax limitations of widgets It does increase the learning cost for developers, and helping widget developers to obtain the same excellent experience as the Web is one thing we are trying to optimize; Continuous enhancements to the toolchain to help developers further reduce costs;

Third, development experience: widget's R&D engineering link details are rough; as a technical product for developers, there are many details on the widget's engineering link that need in-depth polishing and optimization, including preview environment and real environment alignment, provision of performance panel capabilities, enhancement of debugging tool chain, disclosure of online monitoring data, best practices for multi-scenario distribution, upgrade of B-side configuration capabilities, etc.; these are the most pressing issues that developers are most concerned about. Widgets will optimize our developer experience through productization as soon as possible, helping developers to continuously improve their development efficiency and experience through the upgrade of platform capabilities.

Subsequent planning for widgets

The widget project team has fully supported the 2021 Double Eleven promotion of open services, and the widget technology solution has achieved a comprehensive upgrade and optimization of the entire process from framework evolution to kernel switching. More than 30 core members of the project team have successfully gone through various stages such as KO, program review and design, closed test development, and big promotion sprint.

Along the way, the road is blue.

We hope to continue to build a new generation of open technologies that can support multi-scenario and multi-form, API indiscriminate capabilities, and end-to-end construction, to achieve the ultimate global openness, and to provide a higher-quality and broader open track for the ecosystem.

[]()

In this ecological experience:

1. We plan to open a new Rax DSL for the ecosystem, providing developers with new technical language choices;
2. We plan to upgrade the entire monitoring operation and maintenance system for developers, and provide reports such as monitoring alarms, automatic operation and maintenance;
3. We plan to continue to enrich the widget's styling and animation capabilities, and provide more API capabilities;
4. We plan to continue to optimize the developer experience and help developers improve the efficiency of widget development.

In terms of technical infrastructure:

1. We plan to continue to access more Taobao public and private domain scenarios to improve the circulation possibility of widgets;
2. We plan to improve the cross-scenario circulation capability of widgets and improve the circulation efficiency of widgets;
3. We plan to optimize the front-end consumer experience of widgets, optimize the front-end loading time of widgets and introduce widget clustering solutions;
4. We plan to consolidate the basic stability of the widget kernel, and continue to build the underlying infrastructure by practicing internal skills.

Through the dual construction of ecological experience and technical infrastructure, we hope that widgets can become the core weapon for merchants to operate in the private domain, helping merchants to better operate their own consumers on Taobao.

Follow [Alibaba Mobile Technology] WeChat public account, 3 mobile technology practices & dry goods per week for you to think about!