From the birth of WeChat to WeChat public account, WeChat payment, and small programs, Tencent Ecology has influenced users' behavior habits again and again, and has also provided developers with new ideas and skills development directions. Undoubtedly, the development tide of the WeChat applet has already arrived, and it will also become a concentrated outbreak of traffic bonuses in various industries in 2018. On April 28th, the cloud + community technology salon held by Tencent Cloud focused on small program development and actual combat, centered around small program cloud solutions, serverless backend architecture, mini game design and live broadcasting, and development of e-commerce applets. The five major themes of actual combat, sharing the most comprehensive WeChat applet design development ideas and solutions. This article organizes the lecturer's speech exciting content. 1 small program cloud solution Small programs do not need to be installed, are easy to share and spread, and development is easy. At the same time, the user experience is also very good. So, how are these characteristics achieved by him? Tencent Cloud senior engineer Zhu Zhan gave answers from three aspects: small program architecture analysis, small program solution evolution process, and Tencent cloud applet solution introduction. The principle of small programs The development mode of the applet is a web-like mode. Its front end is similar to the front end of the general H5, but it is much simpler than the Java Script development. This is due to the implementation principle and architecture of the applet. The following figure shows the basic architecture of the program. Its upper layer is divided into two sections. One is the view layer, which is WebViews, and the other is the logic layer, which is AppService. The two layers are processed in two different lines. There are fundamental differences in the web. In traditional Web rendering, if there is a complicated process in the logic, it will cause the interface to be stuck. The applet does not have this problem. If no rendering is invoked, the flow of the interface will not be reduced. However, because the view layer and the logic layer are in different threads, the two layers cannot directly interact with each other, and interaction must be achieved through some means. WeChat adopts JSBridge to implement the interaction between the JS operating environment and the native system, when the user is on the interface. When the operation is performed, related events are triggered, passed to the native Webviews, and then to the logic layer. The following figure is a small program rendering flow chart, compile and package the stage, writing a small program needs to write a WXML code, through the WCC compiler tool, enter WAWebView, the user runs the applet, and the logic layer incoming data Make a compile and render to the final interface. The following figure is a partial update process. The following is a simple schematic diagram of the applet loading. When the applet is loaded, the applet must pull a small package on the CDN. The applet may have a waiting time when it is first loaded. When the installation package is cached locally Later, the next time the mobile phone opens the applet, the contents of the installation package are read directly from the cache. If there is a new version, the applet will not wait until the new version is updated and then open the APP. The cached applet, when it is restarted, directly replaces the old one with the new one. At the same time, the applet also provides a Webview pre-loaded performance, in addition to the current view of the Webview, you can also see a new Webview in the background, this pre-loading performance can make some complex small programs in a certain To ensure the speed of loading. The applet's installation package cache, packet loading, independent rendering threads, Webview preloading, and some native components... These tasks allow the applet to have rich functionality while ensuring the opening speed and fluency of the applet, thereby giving the user Bring a perfect experience. Small program solution evolution When developers develop a small program, they need to deal with many non-business logic and need to prepare their own servers. Therefore, they need to spend a lot of effort on the operation and maintenance of the server and the surrounding environment, and cannot concentrate on the business of small programs. Development. In order to free developers from cumbersome configuration, Tencent Cloud has customized a solution based on TenaCloud IaaS capabilities for enterprises and organizations. This is the Tencent Cloud WeChat applet Wafer solution to help developers to deploy more conveniently. Debug server. Wafer1 for enterprise and institutional customers (hereinafter referred to as enterprise customers), provides a business server and a session server, business server to deploy and process business-related logic, and the session server is used to independently handle user sessions ( Logical registration, etc.) The related logic, separation of services and sessions will help small and medium-sized enterprise customers expand their applets in the background. In addition, Tencent Cloud also pulled the database out of the cloud server and provided a cloud database. In addition to the IaaS capable solution wafer, Tencent Cloud also provides various capabilities such as fast communication interfaces, login, and voice recognition to meet various functional needs of users in the development of small programs. Wafer's channel service is a PaaS-level websocket service provided by Tencent Cloud. With channel communication technology, information interaction and transmission between applets and servers can be realized. Tencent's cloud channel communication technology enables current users to directly establish websocket links directly with the channel server. The service server only processes http requests without concern for websocket information. In general, the Wafer channel service has the following major features: No need to develop and use the SDK, and it can be used directly; the platform provides stability and performance guarantees; it can automatically achieve disconnected reconnection; independent credit server and message porter. However, at the same time, the Wafer1 architecture is complex, the developers get started with high costs, and developer code debugging is inconvenient. The solution for wafer2 was proposed in the first half of 2017 in response to the inadequacies of wafer1. It is wafer1 which is a simplified version, and makes wafer1 do some simple merging, taking into account the security and convenience. For example, it makes a session server and a business server. Merge; in wafer1 era we will let users deploy their own server, here we managed hosting, users can buy their own server, but do not need to do server configuration, but also automatically deploy SSL certificates, in addition, Tencent The deep cooperation between Cloud and WeChat has brought wafer2's solution into the WeChat developer space. In addition to the IaaS capable solution wafer, Tencent Cloud also provides uploading code to the development environment, using Devtools to start single-step debugging, installing dependencies in the development environment, restarting/stopping the Node.js program, restoring the initial state, uploading the production environment code, and Tencent cloud console and other series of solutions to log in state, this article does not elaborate here, interested students can log in Tencent cloud official website to try. 2 Use Serverless to build the applet backend The development of small programs and mini-games has become more and more popular, and the background of small programs or mini-games is usually based on the traditional server model, providing API as a back-end service entry for development. Tencent Cloud is trying a new way: use the serverless architecture to implement back-end services. By combining services such as API gateways, cloud functions, and cloud databases, it is possible to automate high-concurrency, fast on-line, and seamless updates without concern for servers. ability. Tencent Cloud SCF server cloud function senior product manager Huang Wenjun explained in detail how to use Serverless to build applet background. WeChat applets and background interaction architecture The applet is a brand-new way of connecting users and services. It can be easily accessed and disseminated in WeChat, and at the same time, it is the most outstanding user experience. Its loading method is faster than the traditional APP method, and development is faster. In addition to its own interface display and data refresh, the applet's data acquisition interacts with the back-end via WeChat. The operation of the applet is a kind of front-end operation. Its entire operation is in WeChat, and it and the backend Interaction is forwarded via WeChat. When the application actually runs and sends a request, the applet first calls the WeChat API and sends an API request. This request is sent to WeChat, and the WeChat is sent to the user's own server through the network request. After the user gets this request on their own service, Data processing, and then respond to the front-end, this is a complete process of small programs and background interaction. In the case of a traditional back-office architecture that requires API services, the first step is to use load balancing, then access the service application server, and then access file storage, including structured and unstructured database services, and caching services. In this process, in order to ensure that the system does not cause service failure due to a certain server downtime, business application clusters, database clusters, distributed file storage, and cache clusters need to be established separately; a primary role of cluster establishment is to ensure that A single point of failure causes the entire service to be unavailable. The following figure shows the traditional background architecture diagram. This multi-service and multi-cluster architecture model is already available in medium- and large-scale Internet companies. However, as an individual developer, it is difficult to build this system. Developers need to understand the configuration of the entire system, such as load balancing. How to configure, how to configure the database cluster and so on. In order to free everyone from the back-end infrastructure and put more time into the business and the applet itself, Tencent Cloud has provided us with a program to build a small program behind the serverless architecture. Serverless architecture introduction The Serverless architecture is called Serverless in English, and Chinese is called serverless, which means that we don't need to buy servers, we don't need to configure virtual machines or physical machines, and it uses computing hosting. Users don't have to worry about security when they use them. Do not worry about the possibility of server downtime. So how did he achieve it? The following figure shows Tencent Cloud's Serverless architecture, which can be seen as two parts. The first part is function-as-a-service. The computing is hosted in a cloud function and truly implements the managed computing of your business logic. The other type is back-end services, including object storage, message queues, cloud databases, cloud caching, API gateways, and so on. Because the Serverless architecture is compute-managed, compute hosting means hosting real business code on the cloud and running it on the cloud. The operating mode of the Serverless architecture has a characteristic that the business logic is triggered to run. After the cloud function is connected with each cloud product or cloud service, events generated by each product or service can trigger the operation of the business logic. We combine the cloud function with the API gateway here. When the applet sends a request to the API gateway, it generates an API request event and then triggers the running of the business code. When the user is hosting, the configuration of the code and the trigger is submitted to the cloud. The code content is the logic processing of the event. In the event of occurrence and processing, for each event, there is a corresponding instance of the code pulled up, in fact, each instance is a separate event. The service runs when the user makes a request, and the service does not run without a request. At the same time, the billing model of its own product is also charged according to the actual service running time. At the same time, by using object storage, people do not have to build distributed storage on their own, and do not have to worry about data loss and security issues. The same applies to databases and message queues provided on the cloud. You can build them without purchasing the server and you can start buying or opening. Used, so this service can also be called Serverless. Serverless Back Office Development Solution So how to use Serverless architecture to achieve background development? If the web service in the traditional architecture is replaced with the Serverless architecture, APIs exposed by external services are provided. We use API gateways to manage the user's business logic. We run within cloud functions and need structured data storage or file storage. We use database services, cloud caching services or object storage services, while other more services can also be used directly provided by Yunshan, directly through code calls. The specific construction plan is shown above. In addition to the startup and display of the page itself, the applet initiates the interaction with the network by the applet. Therefore, the applet initiates the request through the network API, obtains the response, and displays the data on the interface. Can be seen by the user; then through the API gateway management API, configure the API path, methods, parameters and verification, management API release and switch; API gateway is followed by the cloud function, cloud function to process the business logic, initiated Connect to the database, read and write the database, generate response data, according to the actual business situation, if you need to use the database, send a database connection in the code, you need to store the file, call the corresponding object storage interface to write the file The last is a cloud database that stores business data. Through the joint use of several cloud products or cloud services such as API gateways, cloud functions, and cloud databases, we have demonstrated the implementation of applet login services without purchasing and configuring servers, and complete Serverlessization of services. With the small program implemented by the Serverless architecture, developers do not need to worry about operation and maintenance. At the same time, because the operation is stateless, it can easily implement rapid iteration and rapid deployment, and its elastic computing capacity can also satisfy tens of thousands or more of concurrent users. 3 Application of Applets in Live Streaming Products The applet has now been used in all aspects of life, including e-commerce and social networking. Tencent's Web front-end development engineer Yang Chunwen has taken the NOW live broadcast as an example to introduce some of the Tencent applet's attempts in the live broadcast area, including login capability development. Based on Tencent cloud-based audio and video capabilities of live streaming performance comparison and selection, animation development, development of elements in the layout of the live broadcast, the official support of some practical basic capabilities, and share some of the problems encountered in the development process and solutions. How to build a live applet based on Tencent Cloud? For a live applet, how can we build it with the lowest cost? At the applet level, there are two points: the anchor and the viewer. Usually, the anchor needs to complete the push of the video to the server through some components, and then to the audience. In this process, for small program developers, the core points include two: one push flow and one pull flow. In general, it is very troublesome for developers to build transcoding and transmission functions to implement video streaming and streaming. Tencent Cloud has very mature video solutions to help complete this process. The following picture shows Tencent Cloud's live applet solution. The use process is very simple: Apply for Tencent Cloud Live Service; Get encrypted private key; Deploy your own business background (off-the-shelf code); Generate broadcast address (upstream); Generate player address (downstream); Open the applet. Through the above steps, you can basically complete the configuration of the live applet. So, how do you generate the broadcast address and the broadcast address? There are mainly two parts. As shown above, the anchor on the left first generates an outcast address. The applet on the host side pushes the URL to push the video to Tencent Cloud. Tencent Cloud generates a series of encoding, transmission, and decoding. Play the URL and stream it to the viewer by playing the URL (viewing address). Some pits encountered and their solutions The above is how to build a small program, Tencent NOW live broadcast team in the development of live applications, also encountered many problems, Yang Chunwen site on the layout, setData, big picture and preloading pain points and solutions in four aspects explained in detail . The pain of layout Problem Description: Native elements such as video cannot overlap with webview elements. The mixing of video and live elements is difficult, and the cover-view component is too different from ordinary components. Solution: Eclectic use of canvas to achieve dynamic effects, canvas is a native component that can be used for complex layouts. However, there are some problems with the implementation of the canvas. For the time being, for example, when the functions implemented by the canvas are used in small programs, the temperature of the mobile phone increases, there will be a fever phenomenon, etc. The solution is to implement the canvas implemented by the client and us. The web-implemented canvas is differentiated in performance to adapt to different requirements. At the same time, NOW Live Team is also trying to do some performance improvement work to solve user experience problems. setData optimization Description of the problem: setData function is used to send data from the logic layer to the view layer. Frequent SetData is equal to frequent DOM operation, which causes UI delay. At the same time, the large data setData will make the script execution time too large, and setData in the background will also generate excess. The resources (CPU/Memory/Electricity...) are consumed and occupy the foreground JS execution. Solution: Avoid frequent SetData operations. As we continue to scroll through the comments and barrage of the message, the first time each show one needs to perform a SetData operation, and then generate a dom operation, which is very costly. The improved solution is to return multiple messages at a time and scroll through the applet to avoid having a message generate a setData and complete the above trade-offs. In addition, the data update is stopped when onHide is switched from the previous page to the next one, and the previous page recommendation update operation is suspended. The big picture Problem description: The applet rendering layer is implemented through webview. If the image is large, it will not only occupy too much memory, but also cause delay and stalling. Solution: If you absolutely need a big picture, it is recommended that you regularly destroy these large pictures, such as the following pictures, as long as they are not destroyed in the area, if not in this area can be destroyed, if there is always some unwanted pictures, the performance of the Consumption will be relatively large. Preloading Problem Description: Data pre-loading process, page switching, this process is time-consuming Solution: When the user just enters the next page, the page still needs to pull data for rendering. This process needs to go from the A page to the B page, and then to the data. In the middle, this A is switched to B. There is a paragraph in it. Time consumption, in the process of A page cut to B page, you can pull a data at the same time, B page in, directly from the data inside to extract the required data, so you do not need to send a request to re-pull the data, to avoid The consumption of intermediate time and so on is delayed. 4 How to develop a small game The current popularity of the mini-game is no doubt, from the people's "jump" to today's "StarWeGo", the mini-game has gradually infiltrated the daily consumer, becoming one of the entertainment products for all ages. Tencent WeChat's senior engineer Zou Wei combined the groundwork and development design of Starway WeGoing to share how to make use of WeChat's open capabilities to develop a small game. What is a mini-game? From the perspective of the average user, the mini-game is a sub-category of the applet, which can be easily accessed and disseminated within the WeChat, ie point-and-play, with an excellent user experience. Small games are small programs, and ordinary users can't distinguish between them. At the same time, from the developer's perspective, it can be seen as a new platform based on Canvas/WebGL + WeChat social openness. The following figure is an architectural overview of a small game: This is a typical layered architecture. The top blue part is the game code, divided into three parts: game logic, game engine, and weapp-adapter. Most of the game development will use some of the engine's tools, workflows, and use engine-encapsulated high-level APIs to implement the game logic. Followed by weapp-adapter, because the bottom of the game is not a webview on the one hand, can be simply seen as a webview after streamlining, optimization of the platform; on the other hand, the realization of the core capabilities are referenced webview. So if there is an adapter here, adapting the low-level API of the small game, the wx API, to an interface close to the webview will make it easier for the upper engine and the existing games to access the WeChat mini-game platform. This is the weapp-adapter. The role. Only game logic is necessary. The red part of the middle tier is WeChat and the mini-game Runtime. The runtime's ability to expose external calls is called the wx API, and it has a basic library. There is a Javascript code that jsvm uses to execute the game. On Android, it is V8Core, and iOS is JavaScriptCore. The next layer is the implementation of the core rendering capabilities, including Canvas 2d and WebGL, and of course the implementation of the WeChat open capabilities API. It can be seen that there are differences between the small game and the applet in the architecture. The small game does not have the page concept, and wxss/wxml no longer exists. Second, the underlying implementation is not a webview. The relationship between small games and webview can only be said to be related to the core capabilities of the rendering. We can keep the interface consistent with the simple adaptation of the weapp-adapter, but at the same time many webviews do not have the equivalent implementation. For example, there is no DOM/BOM concept for small games, and there is no global document/window object. The entrance to the mini-game is a game js file. The language is Javascript, but there are some restrictions, such as the prohibition of dynamic code execution. Therefore, eval, new Function and other capabilities are not supported. Configure game.json to configure parameters such as horizontal and vertical screens, and interface timeout. Js can combine the capabilities of the wx API to implement the game logic. Non-code resources should be placed on cdn as much as possible to reduce the size of the entire code package after packaging to speed up the user's first entry. WeChat limits the size of the first package. It is 4MB. An overview of the small game capabilities (small game capabilities are continuously expanding, and the latest and complete capabilities can be focused on our development documentation): How to develop a small game? The development process of the core logic of the mini-game is not much different from the traditional endgame, page travel, and current mobile games. Here we will focus on how to make better use of the platform openness of WeChat games, including the selection of small game engine options, device/environmental adaptation, WeChat login, caching, open data domains, sharing, payment, performance, and version update mechanisms. Operation and maintenance of these parts. Choose a small game engine WeChat and the engine business also have close cooperation. Generally, the current game engine will support publishing to multiple platforms. For the new WeChat game platform, some engines have already been adapted, such as Cocos Creator, Egret Engine, and LayAir. Engine. The main job of adaption, similar to the previously mentioned weapp-adapter, links the capabilities of the wx API to the engine. For example, the engine generally targets the small game platform and the webview platform. The adaptation process is the ability to map the wx API to the webview, and removes the dependencies that only exist in the webview capability, such as no longer relying on the BOM or the DOM. Equipment/environmental adaptation WeChat itself runs on different OS platforms, such as iOS and Android, and different platforms run on different physical devices. The small game running on Wechat naturally faces the adaptation of different types of devices and environments. Of course, the game platform has already eliminated their differences as much as possible. However, there are still some jobs that require developers to target specific optimizations, such as high-resolution screens, which can provide higher-definition image quality. The small game will have an API to provide the ability to capture the width and height of the screen and device pixel ratio. After the development of the small game is completed, the developer tool can also initiate a request for a real machine test, and WeChat provides test clusters for different devices to help the developer to find problems in advance. The wx API provided by the base library itself is a constant iterative update process. For small games that use new capabilities, low version compatibility is required. For example, detecting a lower version that does not support the new API allows to compromise the service user. At the same time, if a lower version of the user accounted for less, you can consider directly configuring the minimum version of the basic library required by the mini-game in the management background of mp.weixin.qq.com, which of course means that this part of the user has access to this mini-game. The WeChat client will pop up a prompt asking the user to update to the new version of WeChat to use this mini-game. If he does not update, you may lose the user. WeChat Login The login process of a small game is similar to a small program. Users need to define their own login status. The appsecret/session_key represents a trust agreement between the small game developer and the WeChat platform. For example, the payment and escalation of the hosted data, the platform side needs to verify the access_token (appsecret can only be exchanged), and the user also needs to verify the session_key. Signing can guarantee that requests come from small game developers/users, not malicious third parties and users who arbitrarily make up. Access_token is an application state access_token, has nothing to do with the user, you need to ensure a global maintenance, there should be a control module to ensure that the access_token is valid, and use the local cache access_token directly during the validity period, instead of going to each use Generate a new access_token, otherwise you may encounter call frequency limitations that affect the service. Keep in mind that appsecret/session_key should not be put into the front-end code, otherwise it may be used by bad guys to damage the interests of small game developers/users. Caching Cache types include data caching and file caching. The data cache is key-value storage and is suitable for structured data storage of small size, with an upper limit of 10MB. File Cache provides a complete file system API, including the addition and deletion of directories/files, suitable for local cache for frequently used network resources. The upper limit is 50MB. Unlike browsers, WeChat only provides basic storage management capabilities, and does not do anything about what to store or what to delete when it is full. Developers have the flexibility to define cache and phase-out strategies, such as storing frequently accessed resources to the file system and cleaning up files that have not been accessed in the past when the files are full. Open Data Domain The open data domain is a closed, independent JavaScript scope, and an environment that implements the game logic—called the “main domain†isolation. Its purpose is to open user data to third parties on the premise of ensuring user privacy, and to enhance the overall user experience of small games. The following is a physical view. The entrance of the main domain is game.js, and the open data domain is a separate directory. Its entry file is index.js: The communication between the main domain and the open data domain is strictly regulated. The basic principle is that it does not "go out". Only forward: Allow external data to enter the open data domain, that is, the primary domain can postMessage to the open domain at any time, and the open domain refers to the local resources prepared in the primary domain. No “outâ€: Data from open data domains is not allowed to be uploaded to a third-party server. Because of the open data domain, index.js can directly access user sensitive data, such as playing with friend data. Of course, the final open data domain requires index.js to render data to sharedCanvas in a graphic image after integrating various data. When the subject sharedCanvas allows draw to the upper screen Canvas on the main domain, the end user will see on the screen. Game.js shows social interaction information such as friends leaderboards, group leaderboards, or friends beyond. The current open data domain only supports 2D rendering mode. share it Including custom sharing and system menu sharing, you can share group chat, single chat. It is also possible to associate the sharing context with a specific group and realize the scene of some group PK and group leaderboards. Sharing is a double-edged sword and needs to be used cautiously, on the one hand to avoid excessive harassment of users/group chats, and on the other hand to enhance social interaction to provide a good game experience, and a suitable balance point needs to be found. Payment The mini-games support virtual payment under Android, and its mode is currently only one: money hosting. Mainly divided into two processes: Recharging: RMB -> game currency, where the developer only needs to pull up the payment process, the platform is responsible for converting the user RMB into the corresponding game currency and storing it in the game account corresponding to the user. Use game currency to purchase props: The developer can deduct the corresponding game currency and give the user in-game props. The deduction of the game currency requires a certain transaction mechanism to ensure that the transaction is normal under abnormal network conditions. Deduction of the game currency interface supports de-duplication based on the order id, which means that the network can time out, the developer can use the same order id to retry the deduction until a clear response is returned. The following is a simple sequence diagram, some of the role of the developer do not have to be concerned about the corresponding simplified treatment: performance The common performance problems of small games are generally caused by memory. If too much memory is occupied, the WeChat client will automatically shut down. Therefore, the developer must release the memory that is no longer used during the user's game (js code to remove references, or actively call the release interface of the corresponding resource, if any), In particular, large objects such as Canvas and Image can also actively invoke wx.triggerGC to trigger the underlying recovery of corresponding resources. For work that is relatively independent of the game logic, consider working in a worker. The mini-game provides the ability of independent worker threads to execute js logic. Version update mechanism The process of starting a small game is divided into cold start and warm start. Cold start refers to the process of starting a small game without running an instance of the small game in the memory; a hot start means that a running instance of a small game still exists in the memory, but is temporarily switched to the background, and the user triggers the small time again. The process of returning the game to the front desk. The mini-game will check the version of the mini-game when it is cold-started. If there is a new version, after downloading it back to the local area, the latest version will be available for the next cold start. Of course, we also provide APIs for developers to decide if they need to be forced to update when a version is available: Operation and maintenance The management end of mp.weixin.qq.com provides the ability to publish, grayscale publish, rollback, and stop services to fully utilize the existing capabilities of the platform. In particular, small games have comprehensive back-end monitoring that can be enabled through the "Operation and Maintenance Center", such as script error monitoring. (Script errors are mainly triggered by uncaught exceptions during the process of operation, and require special attention. This type of anomaly may lead to The js logic of the front end of the user's mini-game is paused to execute): 5 The practice of Youzan e-commerce applet Rebecca’s small program store “breaks millions in the first 7 minutes on the first time,†and “breaks millions in the second time in 59 seconds.†Behind these impressive results is the escort of the technical team. The person in charge of the program, Shi Delai, shared with him the development history and status quo of the e-commerce applet, and the accumulation of the praise on the applet technology. For example, the open source of small program component library, how to combine H5 and applet in the micro-page, and some of the problems encountered in the development process, such as how to use the official solution for optimal processing. Before the appearance of the applet, mobile development generally has two modes: the first is a web application such as H5, and the other is a native application. The characteristics of these two modes are very clear. For example, applications such as H5 do not require installation, cross-platform, easy development, and good communication. However, the pages are simple, the opening speed is slow, the native capability is poor, and the user experience is general. The native APP has an exquisite flow of experience and functions, but it requires installation, slow development, troublesome updating, and high professional requirements for development. The small program combines the advantages of both, many H5 needs high-level capabilities to solve the problem, the small program is used to reduce the dimension of the solution, for example, H5 had to do before the asynchronous load and other series of optimization measures in order to make H5 page Opening up faster but small programs solve these problems at a low threshold by means of package submissions, advance downloads, and Native and Web hybrid rendering. In general, small programs integrate features such as simple development, multiple functions, and good experience, and are now mainstream mobile applications. Youzan has been involved in the development of small programs since the beginning of 17 years. With the gradual improvement and updating of the WeChat applet's functions and interfaces, Yazan has concentrated its efforts in the second half of the 17th and started to erupt in 18 years. In terms of functionality, there is a great deal of ability to move all the core capabilities of the original H5 to small programs, and also has the unique ability of small programs. Including shops, merchandise, orders, customer management, data, marketing tools, marketing channels, etc., some of which are references, some are praised and created. The functions here can be said to be very complete, and merchants can make functional choices according to their own needs. At the same time, Youzan also provides small program technical services to merchants of large-scale small programs to ensure the normal operation of small business programs. Technological exploration and accumulation How to simultaneously produce a large number of independent micro mall small programs? Although the codes are the same, each merchant's applet is an independent name, independently submitted for review, and the versions are different. As a platform developer, WeChat provides this capability. When a merchant submits a new version of an applet, the same template ID is used. Each merchant's applet additionally submits an ext.json containing the business's Applet-specific things, such as appid, bottom navigation configuration, etc. Youzan submitted these two messages to WeChat, and WeChat began to review this small program. A set of code two vests There are a lot of public business code between the likes of the public and small app, and the code is in the same repository. The exclusive edition is a subset of the public edition. The public version has a special app.json. We named it app-youzan.json. The exclusive version corresponds to the default app.json. We wrote a webpack plug-in that will merge the contents of app.json to app-youzan.json before compiling the code, and then in the subsequent compilation process, for app-youzan.json (public version) and app .json(专享版)分别打两次，以输出2个版本。 体积æ¥è¶Šå¤§ï¼Œé©¬ä¸Šå°±çªç ´2M了 17å¹´11月份就已ç»1.4M了，眼看按这个趋势很快è¦åˆ°2M，有赞å°è¯•äº†ç”¨ç¬¬ä¸‰æ–¹å·¥å…·wxapp—webpack—plugin，在它基础上二次开å‘了下，åªæ‰“包有用到的模å—，åˆå¹¶é‡å¤çš„模å—。如上图，12月份包的大å°é™äº†ä¸‹åŽ»äº†ï¼ŒåŽæ¥å¾®ä¿¡å¼€æ”¾äº†åˆ†åŒ…的功能，有赞4月份也简å•å°è¯•äº†ä¸€ä¸‹ï¼ŒæŽ¨è大家用起æ¥ã€‚ 如何æ高开å‘效率？ 推è有赞开æºçš„ZanUI-Weapp 组件库（ https://github.com/youzan/zanui-weapp ），Star å·²ç»4k多了。 Zan Proxy（https://github.com/youzan/zan-proxy） 是我们开æºçš„代ç†ã€Mock工具，功能比较全é¢ï¼Œå¯ä»¥å¾ˆæ–¹ä¾¿åœ°åšåˆ°æœ¬åœ°ä»£ç 调试线上页é¢çº¿ä¸ŠæŽ¥å£ã€‚å¦‚æžœä½ è¿˜åœ¨ç”¨nginxåšè¿™ä¸ªäº‹æƒ…，å¯ä»¥è¯•è¯•ZanProxy。 å‰åº—åŽåŽ‚与商家共建产å“的模å¼ï¼Œå¿«é€Ÿè¿ä»£å¾€å‰è·‘，å‡å°‘ä¸é—´çŽ¯èŠ‚。 如何æ高稳定性？ 有赞的方法就是体验版ã€ç¨³å®šç‰ˆæœºåˆ¶ã€‚æ¯2个星期å‘一个新版本，在更新所有å°ç¨‹åºå‰ï¼Œä¼šå…ˆè®©100+å°ç¨‹åºå…ˆå‡çº§åˆ°æ–°ç‰ˆæœ¬ï¼Œè‡³å°‘内测一个星期。这100+å°ç¨‹åºå¯¹åº”的商家就是我们的内测商家。 å¦å¤–一ç§æ–¹æ³•æ˜¯åˆ©ç”¨å¥½å›žæ»šã€æ’¤é”€å®¡æ ¸æŽ¥å£ï¼Œè¿™éƒ¨åˆ†æ˜¯è…¾è®¯æ供的能力，当有赞å‘现æŸä¸€ä¸ªç‰ˆæœ¬æœ‰é—®é¢˜ï¼Œå¯ä»¥æŠŠæ‰€æœ‰æˆ–者部分商家的å°ç¨‹åºéƒ½å›žæ»šåˆ°ä¸Šä¸€ä¸ªç‰ˆæœ¬ã€‚
9v wall charger,AC Power Supply Wall Plug,Wall Adapter Power Supply,9V Power Adapter,ac 50/60hz power adapter,Wall Adapter Power Supply - 9VDC,100-240v converter switching power adapter Shenzhen Waweis Technology Co., Ltd. , https://www.szwaweischarger.com
About this item