Multi-architecture front-end application container adaptation method, system, medium, product and terminal
By building multiple container instances for the front-end application and integrating optimized Node.js runtime versions and system dependency libraries, combined with the environment fingerprinting and intelligent routing of the edge gateway, the compatibility and performance issues in the heterogeneous environment of domestic IT innovation were resolved, achieving efficient resource utilization and a consistent user experience.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- SHANGHAI NAT GRP HEALTH TECH CO LTD
- Filing Date
- 2026-02-04
- Publication Date
- 2026-06-12
AI Technical Summary
Existing technologies lack the ability to deeply optimize front-end applications in heterogeneous environments for domestic IT innovation, and cannot achieve accurate routing and dynamic resource adaptation, resulting in compatibility issues and performance waste.
By building multiple container instances for the same version of the front-end application, integrating optimized Node.js runtime versions and system dependency libraries, and combining edge gateway environment fingerprinting and intelligent routing, the rendering strategy is dynamically adjusted to generate response results adapted to the domestic IT innovation architecture.
It improves the performance of front-end applications on the domestic IT innovation platform, ensures compatibility and resource utilization, and provides a consistent user experience and efficient operation and maintenance capabilities.
Smart Images

Figure CN122195577A_ABST
Abstract
Description
Technical Field
[0001] This application relates to the fields of front-end application development and information technology innovation architecture, and in particular to a method, system, medium, product and terminal for adapting multi-architecture front-end application containers. Background Technology
[0002] With the rapid development of the domestic IT innovation industry, the domestic CPU platform has ushered in a diversified and heterogeneous technological landscape. Under this environment, deploying modern web front-end applications faces the following technical challenges:
[0003] (1) In the application building stage, there is a lack of deep architecture optimization capabilities for heterogeneous environments of domestic IT innovation: Traditional Docker multi-architecture building solutions (such as Docker Buildx) only achieve "runnable" level compatibility guarantees, but do not perform runtime optimization for specific CPU architectures. For example, the optimal compilation parameters and memory management strategies of Node.js's V8 engine differ significantly on different CPU architectures (ARM64 vs LoongArch), and general container images cannot fully utilize the performance potential of specific hardware.
[0004] (2) In the application distribution stage, there is a lack of intelligent routing capabilities based on the awareness of the domestic IT innovation environment: Existing service meshes or edge gateways usually distribute requests based on common load balancing strategies such as IP hashing, round-robin, and least connections, and are completely unable to perceive the client's domestic IT innovation environment. Existing distribution strategies cannot accurately route according to the characteristics of the client's domestic IT innovation environment, which may result in requests running on Loongson terminals (usually equipped with low-version browsers) being routed to container instances optimized for the Kunpeng platform (for modern browsers), causing resource mismatch, compatibility issues, and performance waste.
[0005] (3) In the application rendering stage, there is a lack of dynamic resource adaptation capabilities for the domestic IT innovation environment: Current server-side rendering (SSR) solutions mostly adopt a rendering mode of static templates and fixed resource references. They can only generate target code for a specific environment based on preset configurations during construction, and cannot dynamically adjust the rendering strategy and output content according to the specific domestic IT innovation environment from which the request originates at runtime. In the heterogeneous domestic IT innovation environment, the operating environments of different clients vary greatly. For example, it is impossible to automatically inject ES5 syntax polyfills for IE kernel browsers running on older versions of the Kylin operating system, nor can it load optimized JavaScript computing libraries for specific CPU architectures. Existing rendering solutions cannot achieve the above dynamic adaptation, resulting in compatibility issues for front-end applications in some domestic IT innovation client environments, affecting user experience and application usability.
[0006] To address the aforementioned technical challenges, existing related technologies have the following limitations:
[0007] (1) For general container multi-architecture building solutions, such as Docker Manifest, the core advantage is that it supports “build once, run everywhere”. It can achieve deployment compatibility of the same application image on different CPU architecture platforms through a unified image management mechanism. However, such solutions can only ensure basic runtime compatibility and lack the fine-grained adaptation capability of “build once, optimize everywhere”. It cannot select targeted runtime optimization parameters and system dependencies for different CPU architectures, resulting in the built container image not achieving optimal performance on a specific architecture platform.
[0008] (2) For traditional service mesh routing strategies, technical solutions represented by Istio and Nginx Ingress focus on service discovery, load balancing, and traffic management in their routing rule design. They primarily focus on service availability and stability, lacking the ability to perceive and make decisions regarding the characteristics of the domestic IT innovation environment, such as client hardware architecture and operating system version. Such solutions cannot formulate differentiated routing strategies based on the characteristics of the client's domestic IT innovation environment, making it difficult to solve the request distribution mismatch problem in the heterogeneous domestic IT innovation environment, and failing to provide accurate service instance matching for clients in different environments.
[0009] (3) For static server-side rendering frameworks, such as Next.js and Nuxt.js, although they can generate target code for different environments during construction, they cannot dynamically adjust the rendering strategy and resource injection according to the actual request environment at runtime, and cannot meet the diverse rendering needs in the heterogeneous environment of information technology innovation.
[0010] Therefore, there is an urgent need for a technical solution that can achieve intelligent adaptation of the entire chain of front-end applications from construction and deployment to runtime in a heterogeneous environment of information technology innovation, in order to solve the above-mentioned technical problems. Summary of the Invention
[0011] In view of the shortcomings of the prior art described above, the purpose of this application is to provide a multi-architecture front-end application container adaptation method, system, medium, product and terminal to solve the technical problems in the prior art where the front-end application lacks deep optimization capabilities in the construction stage, lacks intelligent routing capabilities based on the awareness of the domestic IT innovation environment in the distribution stage, and lacks dynamic resource adaptation capabilities for the domestic IT innovation environment in the rendering stage.
[0012] To achieve the above and other related objectives, a first aspect of this application provides a multi-architecture front-end application container adaptation method, applied to a server, wherein the server communicates with a client. The multi-architecture front-end application container adaptation method includes: constructing multiple runnable application container instances for the same version of a front-end application based on the types of multiple target IT innovation architectures, and determining the architecture tag corresponding to each application container instance; responding to an HTTP request signal initiated by the client, performing a hierarchical environment identification operation to generate multi-dimensional IT innovation environment fingerprint information data; based on the multi-dimensional IT innovation environment fingerprint information data and the architecture tag corresponding to each application container instance, performing an environment fingerprint matching calculation operation to determine an application container instance matching the client's IT innovation environment; wherein the application container instance matching the client's IT innovation environment is used as the target container instance; and routing the HTTP request signal to the target container instance so that the target container instance performs environment-aware rendering operations and dynamic resource injection operations, thereby generating response result data adapted to the client's IT innovation architecture.
[0013] In some embodiments of the first aspect of this application, the method of constructing multiple runnable application container instances for the same version of a front-end application based on the types of multiple target information technology innovation architectures, and determining the architecture tag corresponding to each application container instance, includes: selecting optimized Node.js runtime versions and system dependency libraries corresponding to each target information technology innovation architecture based on the types of multiple target information technology innovation architectures; performing encapsulation operations based on the optimized Node.js runtime versions and system dependency libraries corresponding to each target information technology innovation architecture, and based on the business code of the front-end application and the runtime resources depended on by the front-end application, to construct multiple container images for the same version of the front-end application; wherein each container image is applicable to one target information technology innovation architecture; deploying each container image to the applicable target information technology innovation architecture and starting it to run, to construct multiple runnable application container instances for the same version of the front-end application, and determining the architecture tag corresponding to each application container instance.
[0014] In some embodiments of the first aspect of this application, the server is deployed with an edge gateway; wherein, in response to an HTTP request signal initiated by the client, a hierarchical environment identification operation is performed through the edge gateway to generate multi-dimensional information technology innovation environment fingerprint data, the method including: detecting whether the HTTP request signal contains a predefined information technology innovation environment identifier header; if the HTTP request signal contains a predefined information technology innovation environment identifier header, then directly extracting multi-dimensional information technology innovation environment fingerprint data from the information technology innovation environment identifier header; if the HTTP request signal does not contain a predefined information technology innovation environment identifier header, then obtaining client environment fingerprint data according to the session ID, and generating multi-dimensional information technology innovation environment fingerprint data according to the client environment fingerprint data.
[0015] In some embodiments of the first aspect of this application, the method for generating the client environment fingerprint data includes: performing a basic parsing operation on the HTTP request signal accessed for the first time to extract basic information data of the client runtime environment; and performing an injection probe operation based on the basic information data of the client runtime environment to generate client environment fingerprint data.
[0016] In some embodiments of the first aspect of this application, the target container instance is configured with different versions of service resources; wherein, the method of routing the HTTP request signal to the target container instance so that the target container instance performs environment-aware rendering operations and dynamic resource injection operations to generate response result data adapted to the client's domestic IT innovation architecture includes: routing the HTTP request signal to the target container instance so that the target container instance identifies client runtime environment characteristic data based on the multi-dimensional domestic IT innovation environment fingerprint information data, and calls the corresponding version of service resources based on the client runtime environment characteristic data to perform environment-aware rendering operations and dynamic resource injection operations to generate response result data adapted to the client's domestic IT innovation architecture.
[0017] In some embodiments of the first aspect of this application, the method of calling corresponding versions of service resources based on the client runtime environment characteristic data to perform environment-aware rendering operations and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture, includes: selecting an adapted basic rendering rule set from multiple preset rendering rule sets based on the client runtime environment characteristic data; performing environment-aware rendering operations on the business code of the front-end application based on the basic rendering rule set to generate basic rendering results; calling corresponding versions of service resources in the target container instance based on the client runtime environment characteristic data to determine the target input resources adapted to the client's domestic IT innovation environment; and performing dynamic resource injection operations based on the basic rendering results and the target input resources to generate response result data adapted to the client's domestic IT innovation architecture.
[0018] To achieve the above and other related objectives, a second aspect of this application provides a multi-architecture front-end application container adaptation system, comprising: a multi-architecture application container construction module, configured to construct multiple runnable application container instances for the same version of a front-end application based on the types of multiple target information technology innovation architectures, and determine the architecture tag corresponding to each application container instance; an environment identification module, configured to perform a hierarchical environment identification operation in response to an HTTP request signal initiated by a client, to generate multi-dimensional information technology innovation environment fingerprint information data; a container matching module, configured to perform an environment fingerprint matching calculation operation based on the multi-dimensional information technology innovation environment fingerprint information data and the architecture tag corresponding to each application container instance, to determine the application container instance that matches the client's information technology innovation environment; wherein the application container instance that matches the client's information technology innovation environment is used as the target container instance; and an environment rendering and resource injection module, configured to route the HTTP request signal to the target container instance, so that the target container instance performs an environment-aware rendering operation and a dynamic resource injection operation, thereby generating response result data adapted to the client's information technology innovation architecture.
[0019] To achieve the above and other related objectives, a third aspect of this application provides a computer-readable storage medium having a computer program stored thereon, which, when executed by a processor, implements the multi-architecture front-end application container adaptation method as described above.
[0020] To achieve the above and other related objectives, a fourth aspect of this application provides a computer program product including computer program code, which, when run on a computer, enables the computer to implement the multi-architecture front-end application container adaptation method as described above.
[0021] To achieve the above and other related objectives, a fifth aspect of this application provides an electronic terminal, including a memory, a processor, and a computer program stored in the memory, wherein the processor executes the computer program to implement the multi-architecture front-end application container adaptation method as described above.
[0022] As described above, the multi-architecture front-end application container adaptation method, system, media, product, and terminal of this application have the following beneficial effects:
[0023] (1) Significant performance improvement: By building container images for the same version of the front-end application that are applicable to different types of target information technology innovation architectures, the optimized Node.js runtime version and system dependency library corresponding to each target information technology innovation architecture are integrated, which improves the performance of the front-end application on the information technology innovation platform and gives full play to the potential of domestic hardware.
[0024] (2) Compatibility is guaranteed: Through runtime environment-aware rendering and dynamic resource injection mechanism, the rendering rules can be automatically adjusted according to the actual running environment of the client, ensuring that the front-end application can work normally under different information technology innovation environments (different CPU, OS, browser combinations) and provide a consistent user experience.
[0025] (3) Resource utilization optimization: Based on the multi-dimensional information fingerprint data of the information technology innovation environment, the edge gateway intelligently routes the HTTP request signal to the target container instance with the highest tag matching degree, avoids resource mismatch, and enables the resources of each architecture-optimized instance in the cluster to be used efficiently, thereby improving the overall resource utilization and operating efficiency of the cluster.
[0026] (4) Enhanced operation and maintenance capabilities: The front-end application is deployed as a container instance, enabling it to have deployment, monitoring, canary release, and rollback capabilities similar to back-end microservices. It can manage application versions and running status, improving operability and security in the sensitive environment of information technology innovation.
[0027] (5) Zero intrusion into business code: All adaptation logic is completed in the delivery chain (build, gateway, rendering engine), and developers can obtain multi-architecture optimization support without modifying business code, reducing development and maintenance costs. Attached Figure Description
[0028] Figure 1 The diagram shown is a flowchart illustrating a multi-architecture front-end application container adaptation method in one embodiment of this application.
[0029] Figure 2 The diagram shows a process for constructing multiple application container instances in one embodiment of this application.
[0030] Figure 3 The diagram shown is a flowchart illustrating the hierarchical environment identification operation in one embodiment of this application.
[0031] Figure 4 The diagram shown is a flowchart of intelligent routing in one embodiment of this application.
[0032] Figure 5 The diagram shown is a loading illustration of dynamic resource injection in one embodiment of this application.
[0033] Figure 6 This is shown as another flowchart of a multi-architecture front-end application container adaptation method in one embodiment of this application.
[0034] Figure 7 The diagram shown is a schematic block diagram of a multi-architecture front-end application container adaptation system according to an embodiment of this application.
[0035] Figure 8 The diagram shown is a structural schematic of an electronic terminal according to an embodiment of this application. Detailed Implementation
[0036] The following specific examples illustrate the implementation of this application. Those skilled in the art can easily understand other advantages and effects of this application from the content disclosed in this specification. This application can also be implemented or applied through other different specific embodiments, and various details in this specification can also be modified or changed based on different viewpoints and applications without departing from the spirit of this application. It should be noted that, unless otherwise specified, the following embodiments and features in the embodiments can be combined with each other.
[0037] Before providing a further detailed description of the present invention, the nouns and terms used in the embodiments of the present invention are explained, and the nouns and terms used in the embodiments of the present invention are subject to the following interpretations:
[0038] <1> The Information Technology Application Innovation Industry (ITAI) is a strategic emerging industry developed by my country to achieve self-reliance and control in the field of information technology and to safeguard national information security. Its core objective is to break free from dependence on foreign software and hardware technologies and build a fully self-reliant and controllable information technology ecosystem, from underlying hardware to upper-level software.
[0039] <2> Web (World Wide Web): The World Wide Web is an information system built on the Internet and composed of countless interconnected hypertexts.
[0040] <3> Node.js is a JavaScript runtime environment built on the Chrome V8 engine that supports manipulating local system resources.
[0041] <4> JavaScript is an interpreted, weakly typed scripting language whose core function is to add interactive logic and dynamic effects to web pages, making static web pages "interactive and dynamically updatable".
[0042] <5> Chrome: Google Chrome, built on the Chromium rendering engine, is characterized by its smooth operation, rich extension ecosystem, and strong compatibility. It is one of the most widely used web browsers in the world.
[0043] <6> Chromium is an open-source web page rendering engine and a core underlying component of the Chrome browser. It is responsible for parsing and rendering web page resources such as HTML, CSS, and JavaScript to present a complete web page interface.
[0044] <7> HTML (Hyper Text Markup Language): A markup language whose core function is to build the structural framework of web pages.
[0045] <8> CSS (Cascading Style Sheets): Its core function is to set visual styles for the structure of web pages built with HTML, thus solving the problem of web page aesthetics.
[0046] <9> Docker: Containerization technology / container engine, is a technology that can package software programs and all their dependencies (such as system libraries, configuration files, runtime plugins, etc.) into standardized "containers".
[0047] <10> Docker Buildx: Docker's multi-architecture build tool, is a functional extension plugin for Docker that can build container images adapted to multiple different CPU architectures at once, achieving the effect of "build once, run on multiple architectures", making it convenient to deploy programs in heterogeneous hardware environments.
[0048] <11> CPU: Central Processing Unit, is the core computing component of computers, servers and other devices. It is equivalent to the "brain" of the device. It is responsible for executing all the calculation instructions and logical judgments of the program. Its architecture and performance directly determine the operating efficiency of the device.
[0049] <12> ARM64: 64-bit Reduced Instruction Set Architecture. It is a CPU design architecture characterized by simplified instructions, low power consumption, and high execution efficiency. It is widely used in mobile devices such as mobile phones and tablets, and is also one of the mainstream architectures used in domestic server CPUs.
[0050] <13> LoongArch: Loongson architecture is a CPU instruction set architecture that is completely independently developed in my country. It does not rely on any foreign technology licenses and is specifically adapted to the Loongson series of domestic CPUs. It is mainly used in servers and terminal equipment in key information technology innovation fields such as government, finance, and energy. It is one of the core hardware technologies to ensure the independent control of information technology.
[0051] <14> IP (Internet Protocol): The Internet Protocol is a set of rules for computer devices to communicate on a network. It also assigns a unique IP address to each device connected to the network. This address is like a "house number" for the device on the network, allowing data to accurately find the target device to be sent to.
[0052] <15> SSR (Server-Side Rendering): Server-side rendering is a front-end page rendering technology where the server generates the complete HTML content of the page in advance and then sends it to the user's browser. This method can make the page load faster and is also more conducive to search engines crawling the page content.
[0053] <16> IE (Internet Explorer): An internet browser, a classic web browser developed by Microsoft.
[0054] <17> ES5 (ECMAScript 5): is the international standard for the JavaScript language. ES5 is the fifth version of this standard, and it is also a very classic and highly compatible version.
[0055] <18> A polyfill is a compatibility patch, a piece of JavaScript code that "fills in" functional gaps in older browsers.
[0056] <19> Docker Manifest: A Docker image manifest is a metadata file that contains information about images with different architectures. Its purpose is to associate images with the same name on different CPU architectures to form a unified image identifier.
[0057] <20> Istio: Istio Service Mesh, also known as Istio Service Mesh for short, is an open-source service mesh technology primarily used to manage communication between microservices. Its core functionalities include service discovery, load balancing, traffic control, circuit breaking and degradation, and monitoring and tracing. It helps developers achieve stable operation and traffic management of microservice architectures without modifying business logic code.
[0058] <21> Nginx Ingress: The Nginx ingress controller, its main function is to act as an "entry gateway" for external traffic entering internal services within the cluster. It can forward external requests to the corresponding microservices within the cluster by configuring routing rules, and also provides functions such as load balancing, SSL certificate management, and path rewriting.
[0059] <22> SSL (Secure Sockets Layer): The Secure Sockets Layer protocol is an encryption protocol used to ensure the security of network communication. Its main function is to establish an encrypted secure channel between the client (such as a browser) and the server, so that data cannot be stolen, tampered with or forged during transmission.
[0060] <23> Next.js: The Next.js framework is a React-based server-side rendering (SSR) framework designed for building high-performance modern web applications. It includes built-in server-side rendering, static site generation (SSG), routing system, API routing, and other functions, which can effectively improve page load speed and search engine optimization (SEO) results. It is a mainstream React server-side rendering solution in front-end development.
[0061] <24> React (React JavaScript Library): The React front-end framework, also often simply called the reactive framework, is mainly used to build user interfaces, and is especially suitable for developing complex single-page applications.
[0062] <25> SSG (Static Site Generation): Static site generation is a front-end application building technique that refers to generating static HTML files for all pages directly during the application building phase, rather than dynamically generating content at runtime.
[0063] <26> SEO (Search Engine Optimization): Search engine optimization is a series of strategies and methods for optimizing website content and structure, with the aim of improving the website's organic ranking in search engine results (such as Baidu and Google), thereby acquiring more free and targeted traffic.
[0064] <27> Nuxt.js: The Nuxt.js framework is a server-side rendering (SSR) framework based on Vue.js, specifically designed to provide server-side rendering capabilities for the Vue ecosystem. It integrates features such as automatic route generation, static site generation, middleware, and state management, simplifying the server-side rendering development process for Vue applications and helping developers quickly build high-performance Vue applications.
[0065] <28> Vue is a progressive JavaScript framework for building user interfaces. It is used to implement all visual interfaces, user interaction logic, and front-end business functions. The code built by Vue can be rendered and run in the Chromium kernel of Nw.js.
[0066] <29> Vite: A front-end build tool, a high-performance front-end engineering build tool used to compile and build Vue client source code into runnable static web resources.
[0067] <30> Nw.js (Node-Webkit): A node-based web framework, it is a cross-platform development framework that integrates the Chromium rendering engine and the Node.js runtime environment, allowing developers to quickly build applications that are compatible with various desktop operating systems using web technologies such as HTML, CSS, and JavaScript.
[0068] <31> API (Application Programming Interface): An application programming interface is a standardized interface for software components to interact with each other and make function calls, providing a unified way of calling the API.
[0069] <32> Vue.js: Vue is an open-source progressive JavaScript framework primarily designed for building user interfaces, making it especially suitable for developing single-page applications.
[0070] <33> HTTP (Hypertext Transfer Protocol) is an application layer communication protocol whose core function is to standardize the data transmission format and interaction rules between browsers (clients) and web servers. It is the fundamental protocol that supports the normal operation of the World Wide Web (Web).
[0071] <34> MIPS64: 64-bit MIPS architecture, a 64-bit reduced instruction set CPU architecture.
[0072] <35> x86_64: 64-bit x86 architecture, the current mainstream 64-bit complex instruction set CPU architecture for servers.
[0073] <36> Front-end applications refer to the web pages and systems developed, such as government portals and management back-ends.
[0074] <37> NEON: Advanced SIMD (Single Instruction Multiple Data) Extended Instruction Set, is a vector operation acceleration instruction set exclusive to ARM architectures (such as Kunpeng ARM64).
[0075] <38> optimized-for:kunpeng-920: This is an architecture optimization feature tag added to the container image metadata. Its core function is to mark that the image has been deeply optimized for the Kunpeng 920 chip in terms of instruction set, dependency libraries, etc.
[0076] <39> Blink: The Blink browser kernel is widely used in many domestically developed browsers and is one of the core components of modern browsers, responsible for page rendering and script execution.
[0077] <40> WebKit: The WebKit browser engine is commonly used in some domestically developed browsers. It supports core functions such as page structure parsing and style rendering. Older versions need to be adapted to specific compatibility rules.
[0078] <41> Gecko: The Gecko browser kernel. Some domestically developed browsers are based on it and require custom style prefixes and compatibility patches to ensure rendering consistency.
[0079] <42> -moz-: A Gecko-specific prefix for Cascading Style Sheets (CSS). It is used to adapt styles to Gecko-based browsers and must be added before the relevant style definitions to ensure that CSS features take effect correctly in that browser environment.
[0080] <43> ES6: ECMAScript 6 scripting language standard, supports features such as modularity and arrow functions. Modern browsers of higher versions support it directly, while lower versions require adaptation through compatibility files.
[0081] <44> OS: Operating system, the core software of a computer system. Common domestic operating systems in the information technology innovation scenario include Kylin and UnionTech, which need to be adapted and optimized according to their version characteristics.
[0082] <45> Kylin V10 SP1: Kylin OS V10 SP1 version has specific CSS compatibility issues in some scenarios, which need to be fixed with a dedicated patch stylesheet.
[0083] <46> WebAssembly: A high-efficiency binary execution format that can improve the performance of complex calculations in web pages, with optimized versions available for different CPU architectures.
[0084] <47> SIMD: Single Instruction Multiple Data Parallel Computing, is a processor optimization technique that improves the efficiency of parallel data processing. It is often used to optimize JavaScript libraries or WebAssembly modules on architectures such as ARM64.
[0085] <48> ARM: The ARM processor architecture is widely used in domestically produced domestically developed IT terminals. It requires corresponding optimized resources to ensure operating efficiency.
[0086] <49> UI: User Interface, refers to the visual interactive interface presented to users by an application.
[0087] <50> AVX2: Advanced Vector Extensions 2 instruction set, a CPU performance optimization instruction set, often used for resource optimization in x64 architectures to improve the processing speed of computationally intensive tasks.
[0088] <51> x64: A 64-bit processor architecture commonly used in desktop and server-side IT innovation devices, requiring corresponding optimization libraries and execution modules.
[0089] <52> loongarch-optimized: Loongson architecture optimized version, is an identifier for container images and application instances specifically for the Loongson architecture.
[0090] <53> kunpeng-modern: A modernized version of the Kunpeng architecture, identifying optimized instances for modern browsers and high-version runtime environments based on the Kunpeng architecture.
[0091] <54> kunpeng-optimized: An optimized version of the Kunpeng architecture, serving as an identifier for Kunpeng architecture container images and application container instances.
[0092] <55> kunpeng-ssl-accel: The Kunpeng architecture SSL hardware acceleration library, is one of the system dependency libraries encapsulated in the Kunpeng image. It is used to accelerate encryption and decryption operations by leveraging the characteristics of Kunpeng hardware.
[0093] <56> kunpeng-math-optimized: A mathematical computation optimization library for the Kunpeng architecture. It is also a system dependency library for the Kunpeng image and is used to optimize the performance of mathematical computation and data processing in the Kunpeng environment.
[0094] <57> ARM NEON: The NEON vectorized computing instruction set of the ARM architecture is a vectorized computing technology injected into the Kunpeng (based on the ARM architecture) image to improve the efficiency of parallel data processing in the Kunpeng environment.
[0095] <58> CPU Class: CPU architecture type identifier.
[0096] <59> Kubernetes: An open-source container orchestration and management platform that is responsible for the entire lifecycle of container instance operations and maintenance, including deployment, scheduling, scaling, monitoring, fault self-healing, and version management.
[0097] <60> Envoy: An open-source, high-performance edge proxy / service mesh proxy tool that focuses on traffic forwarding, request filtering, and dynamic routing.
[0098] <61> NGINX: A high-performance web server and reverse proxy tool from the source, whose core functions include request distribution, load balancing, static resource hosting, and route configuration.
[0099] <62> try-catch is the core exception handling mechanism built into most programming languages. It is used to catch and handle exceptions that may occur during program execution (such as syntax and logic errors, resource access failures, data type mismatches, etc.), to prevent a single exception from causing the entire program to crash, and to ensure the robustness and continuous operation of the program.
[0100] <63> Session ID: A unique character sequence (usually generated by a random combination of numbers, letters, and special symbols) assigned by the server to each temporary interactive session established with the client in computer networks, software systems, and client-server architectures. It is the identifier that distinguishes different user / client temporary sessions.
[0101] <64> Flexbox: Flexible layout is the core layout model in CSS (Cascading Style Sheets), used to achieve flexible scaling and adaptive arrangement of elements, allowing child elements within a container to automatically adjust their width, height, and arrangement according to the container size.
[0102] <65> min-width: Minimum width, is a basic CSS size control property used to set the minimum display width of an HTML element.
[0103] <66> transition: Transition effect is a CSS animation property used to achieve a smooth gradient transition when the style of an element (such as width, color, position, etc.) changes.
[0104] <67> -webkit-: This is a private CSS tag designed for browsers / operating system environments compatible with the WebKit engine. It must be added before CSS properties.
[0105] <68> CI / CD: An automated pipeline technology in the DevOps system, used to automate the entire process of "code submission → verification → build → deployment".
[0106] With the rapid development of the domestic IT innovation industry, the domestic CPU platform has ushered in a diversified and heterogeneous technological landscape. Deploying modern web front-end applications in this environment faces the following technical challenges: In the application building stage, there is a lack of deep architectural optimization capabilities for heterogeneous domestic IT innovation environments. General multi-architecture container building solutions only guarantee basic compatibility and cannot match targeted runtime optimizations and system dependencies for different CPU architectures, making it difficult to unleash the full potential of hardware performance. In the application distribution stage, there is a lack of intelligent routing capabilities based on domestic IT innovation environment awareness. Traditional service meshes and edge gateways use general load balancing strategies, which cannot accurately route based on the characteristics of the client's domestic IT innovation environment, easily leading to mismatches between requests and optimized container instances, causing compatibility issues and performance waste. In the application rendering stage, there is a lack of dynamic resource adaptation capabilities for domestic IT innovation environments. Static server-side rendering solutions cannot dynamically adjust rendering strategies and output content at runtime according to the client's domestic IT innovation environment, resulting in compatibility defects in front-end applications in some domestic IT innovation client environments, affecting user experience and usability. Existing technical solutions cannot effectively address the technical issues of insufficient deep optimization in the front-end application building process, lack of environmental awareness in the distribution process, and lack of dynamic adaptation in the rendering process. As a result, front-end applications in the domestic IT innovation heterogeneous environment cannot achieve optimal performance, best compatibility, and most reasonable resource utilization in deployment and operation.
[0107] Based on the technical problems existing in the background technology mentioned above, this application provides a multi-architecture front-end application container adaptation method, system, medium, product and terminal, which aims to solve the technical problems in the prior art that the front-end application lacks deep optimization capabilities in the construction stage, lacks intelligent routing capabilities based on the awareness of the information technology innovation environment in the distribution stage, and lacks dynamic resource adaptation capabilities for the information technology innovation environment in the rendering stage, so as to realize the full-link intelligent adaptation of the front-end application under the multi-information technology innovation architecture.
[0108] To facilitate understanding of the embodiments of this application, firstly, in conjunction with Figure 1 Detailed explanation. Figure 1 This document illustrates a flowchart of a multi-architecture front-end application container adaptation method according to an embodiment of the present invention. The multi-architecture front-end application container adaptation method is applied to the server, which communicates with the client. The multi-architecture front-end application container adaptation method in this embodiment mainly includes the following steps:
[0109] S101: Based on the types of multiple target information technology innovation architectures, build multiple runnable application container instances for the same version of the front-end application, and determine the architecture tag corresponding to each application container instance.
[0110] In this embodiment, as Figure 2The diagram illustrates the process of constructing multiple application container instances in an embodiment of the present invention. Based on the types of multiple target information technology innovation architectures, multiple runnable application container instances are constructed for the same version of the front-end application, and the method for determining the architecture tag corresponding to each application container instance includes:
[0111] (1) Based on the types of multiple target information technology innovation architectures, select the optimized Node.js runtime version and system dependency library corresponding to each target information technology innovation architecture.
[0112] (2) Based on the optimized Node.js runtime version and system dependency library corresponding to each target IT innovation architecture, and based on the business code of the front-end application and the runtime resources that the front-end application depends on, perform encapsulation operations to build multiple container images for the same version of the front-end application; wherein each container image is applicable to one target IT innovation architecture.
[0113] (3) Deploy each of the container images to the applicable target information technology innovation architecture and start running them, so as to build multiple runnable application container instances for the same version of the front-end application, and determine the architecture tag corresponding to each application container instance.
[0114] In this embodiment, the target domestic IT architecture types include, but are not limited to: Kunpeng architecture (e.g., ARM64), Loongson architecture (e.g., MIPS64 / LoongArch), and Zhaoxin architecture (e.g., x86_64). Utilizing Docker Manifest features, container images suitable for different types of target domestic IT architectures are built for the same version of the front-end application. These container images are then uniformly pushed to the image repository to complete the container image construction. During the construction process, an optimized Node.js runtime version and system dependency libraries for the target domestic IT architecture are dynamically selected and integrated based on its type. For example, a Node.js binary package and mathematical computation library supporting NEON instruction set acceleration are selected for the Kunpeng ARM64 architecture. A V8 engine and cryptographic acceleration library optimized for the Loongson instruction set are selected for the Loongson LoongArch architecture.
[0115] In this embodiment, based on the optimized Node.js runtime version and system dependency libraries corresponding to each target domestic IT innovation architecture, and based on the business code of the front-end application and the runtime resources it depends on, an encapsulation operation is performed. This involves encapsulating the optimized Node.js runtime version and system dependency libraries corresponding to the target domestic IT innovation architecture, along with the business code and runtime resources of the front-end application, into a Docker container image. This creates multiple container images for the same version of the front-end application, such as the Kunpeng image, the Loongson image, and the Zhaoxin image. Furthermore, architecture optimization features (such as `optimized-for:kunpeng-920`) are marked in the metadata of the container images to determine the architecture tag corresponding to each container image.
[0116] In this embodiment, the container image is deployed to the target domestic IT architecture corresponding to the server and a startup command is executed to generate multiple application container instances that can run under the same version of the front-end application, without the need to install Node.js or dependent resources separately. For example, the container image of the Kunpeng ARM64 architecture is deployed to the Kunpeng server cluster, the Kunpeng image of the Loongson LoongArch architecture is deployed to the Loongson server cluster, and the container image of the Zhaoxin x86_64 architecture is deployed to the Zhaoxin server cluster. After startup, three application container instances that can run under the same version of the front-end application are formed, and each application container instance is automatically associated with the architecture tag of the corresponding container image.
[0117] In this embodiment, an application container instance (Pod) is a running instance of the same version of the front-end application deployed on the server, adapted to different target domestic IT innovation architectures. Although these application container instances are adapted to different architectures and have different tags, they are all running carriers of the "same version of the front-end application", with consistent functional logic, only the underlying running environment is adapted to different types of target domestic IT innovation architectures.
[0118] S102: In response to the HTTP request signal initiated by the client, perform hierarchical environment identification operation to generate multi-dimensional information fingerprint data of the information technology innovation environment.
[0119] In this embodiment, as Figure 3 The diagram illustrates a flowchart of the hierarchical environment identification operation in an embodiment of the present invention. The server is deployed with an edge gateway; wherein, in response to an HTTP request signal initiated by the client, the hierarchical environment identification operation is performed through the edge gateway to generate multi-dimensional information fingerprint data of the domestic IT innovation environment, the method of which includes:
[0120] S1021: Detect whether the HTTP request signal contains a predefined information technology innovation environment identifier header.
[0121] S1022: If the HTTP request signal contains a predefined information technology innovation environment identifier header, then the multi-dimensional information technology innovation environment fingerprint information data is directly extracted from the information technology innovation environment identifier header.
[0122] S1023: If the HTTP request signal does not contain a predefined domestic IT innovation environment identifier header, then obtain the client environment fingerprint data based on the session ID, and generate multi-dimensional domestic IT innovation environment fingerprint information data based on the client environment fingerprint data.
[0123] In this embodiment, a container orchestration environment supporting service mesh is deployed on the server side. The edge gateway is enhanced to possess fingerprint recognition and intelligent routing capabilities for domestically developed environments. When a frontend request arrives, the edge gateway performs a hierarchical environment identification operation on the HTTP request signal, as described below:
[0124] (1) First priority: explicit identification detection. Prioritize detecting whether the HTTP request signal contains a domestic innovation environment identifier header (e.g., X-domestic innovation-architecture, X-domestic innovation-CPU, etc.) predefined by the domestic innovation administrator. If the domestic innovation environment identifier header is detected, extract multi-dimensional domestic innovation environment fingerprint information data such as the client's system domestic innovation architecture, CPU model, and operating system version directly from the domestic innovation environment identifier header, and skip the injection probe operation and directly enter step S103.
[0125] (2) Second priority: If the predefined information technology innovation environment identifier header is not detected, the client environment fingerprint data is obtained according to the session ID, and multi-dimensional information technology innovation environment fingerprint information data is generated according to the client environment fingerprint data.
[0126] In this embodiment, the method for generating the client environment fingerprint data includes:
[0127] (1) For the first access to the HTTP request signal, perform basic parsing operations to extract basic information data of the client's runtime environment.
[0128] (2) Based on the basic information data of the client's operating environment, perform the injection probe operation to generate client environment fingerprint data.
[0129] In this embodiment, if the client initiates an HTTP request for the first time, and the HTTP request does not contain a predefined domestic IT environment identifier header, the edge gateway first performs basic parsing operations based on preliminary information such as the User-Agent in the request header to obtain basic information data about the client's runtime environment. This basic information data includes, but is not limited to, browser type data, browser base version data, and operating system data. Based on this basic information data, the edge gateway intelligently pre-routes to the most likely matching or universal application container instance, routing the client's initial HTTP request to that application container instance to generate the initial response data. Simultaneously, an injection probe operation is performed, injecting a lightweight JavaScript environment probe code. The initial response data and the environment probe code are then returned to the client. This environment probe code executes in the client's browser and reports comprehensive client environment fingerprint data (i.e., fingerprint reporting) to the server. This environment probe code is wrapped in a try-catch block and will not trigger exception alarms in the domestic IT environment, thus preventing program crashes. The environment probe code executes in the client browser, proactively probing the environment's capabilities and reporting comprehensive client environment fingerprint data (i.e., probe-reported data) to the server through multiple detection modules. This client environment fingerprint data covers at least the following dimensions of information:
[0130] (1) Computing resource dimension: a quantitative indicator reflecting the client's parallel processing capability.
[0131] (2) Software environment dimension: Detailed information identifying browser type, browser version and rendering engine.
[0132] (3) Hardware characteristics dimension: Evaluation of the client’s tendency to support specific computing modes (such as SIMD vectorized computing) through performance benchmark tests, providing auxiliary reference information for architecture matching.
[0133] (4) Standards compatibility dimension: the compatibility support status of key Web technology standards and APIs.
[0134] In this embodiment, the server associates and stores client environment fingerprint data with client sessions (such as Session IDs). When the same client initiates a subsequent HTTP request, a basic parsing operation is performed first to extract basic information about the client's runtime environment. The edge gateway queries the stored client environment fingerprint data using the session ID and generates multi-dimensional domestic IT innovation environment fingerprint information based on the client environment fingerprint data and the basic information about the client's runtime environment. This determines the application container instance that matches the client's domestic IT innovation environment, enabling subsequent requests to be accurately routed to the optimal container instance. The multi-dimensional domestic IT innovation environment fingerprint information includes key dimensions such as the client's system domestic IT innovation architecture, CPU model, and operating system version.
[0135] It is worth noting that when the client makes its first request, it does not need to wait for the probe to finish executing before obtaining the response data. Instead, the probe executes silently in the background of the client during the first access, without affecting the user experience. The user can see the response result of the front-end application of the application container instance. On the second access by the client, the server queries the stored client environment fingerprint data based on the session ID of the first access, thereby matching the optimal application container instance and taking into account the first response speed.
[0136] S103: Based on the multi-dimensional information technology innovation environment fingerprint information data and the architecture tag corresponding to each application container instance, perform an environment fingerprint matching calculation operation to determine the application container instance that matches the client's information technology innovation environment; wherein, the application container instance that matches the client's information technology innovation environment is taken as the target container instance.
[0137] In this embodiment, the edge gateway uses multi-dimensional fingerprint information data of the domestic IT innovation environment and the architecture tags corresponding to each application container instance to identify the application container instance that matches the client's domestic IT innovation environment. This matching application container instance is then used as the target container instance, allowing HTTP request signals to be dynamically routed to the application container instance with the highest tag matching degree. For example, HTTP requests from Loongson terminals are routed to application container instances tagged with "loongarch-optimized," and requests from the Kunpeng terminal's modern browser are routed to application container instances tagged with "kunpeng-modern."
[0138] S104: The HTTP request signal is routed to the target container instance so that the target container instance performs environment-aware rendering operations and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture.
[0139] In this embodiment, as Figure 4The diagram illustrates the intelligent routing process in this embodiment of the invention. When a client initiates an HTTP request, if the HTTP request contains a predefined domestic IT environment identifier header, multi-dimensional domestic IT environment fingerprint information is directly extracted from the header. Based on this fingerprint, an environment fingerprint matching calculation is performed to determine the application container instance matching the client's domestic IT environment. The HTTP request is then routed to this matching application container instance, i.e., the target container instance. If the HTTP request does not contain a predefined domestic IT environment identifier header, the stored client environment fingerprint data is retrieved based on the session ID. Multi-dimensional domestic IT environment fingerprint information is then generated based on the client environment fingerprint data and the client's runtime environment basic information to determine the application container instance matching the client's domestic IT environment. The Node.js service in the target container instance receives the HTTP request signal forwarded by the edge gateway. Based on the multi-dimensional information fingerprint data of the domestic IT innovation environment, it performs environment-aware rendering operations and dynamic resource injection operations to complete the rendering of the front-end application (SSR) on the server side. The server-side rendering engine can accurately perceive the domestic IT innovation environment fingerprint of the current request and dynamically inject the most suitable resources into the final generated HTML response to generate response result data adapted to the client's domestic IT innovation architecture and return the response result data to the client.
[0140] In this embodiment, the target container instance is configured with different versions of service resources. The method of routing the HTTP request signal to the target container instance to enable it to perform environment-aware rendering and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture, includes: routing the HTTP request signal to the target container instance so that the target container instance identifies client runtime environment characteristic data based on the multi-dimensional domestic IT innovation environment fingerprint information data, and calls the corresponding version of service resources based on the client runtime environment characteristic data to perform environment-aware rendering and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture.
[0141] In this embodiment, the service mesh routes the HTTP request signal to the target container instance. The target container instance identifies the client's runtime environment characteristic data based on the multi-dimensional domestic IT innovation environment fingerprint information data, such as the client's domestic IT innovation architecture, the type and specific version number of the operating system used, the type and specific version number of the browser kernel used, and other related characteristic data.
[0142] In this embodiment, the method of calling the corresponding version of service resources based on the client runtime environment characteristic data to perform environment-aware rendering operations and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture, includes:
[0143] (1) Based on the client's runtime environment feature data, select the appropriate basic rendering rule set from multiple preset rendering rule sets.
[0144] In this embodiment, the CSS prefix parsing logic and feature detection logic are dynamically adjusted based on the browser kernel type (Blink, WebKit, Gecko) and specific version number. For compatibility differences between different kernel versions, the feature support status detection logic is optimized, downgrade detection rules for lower-version kernels are added, and redundant detection steps for obsolete features in higher-version kernels are removed. This allows for the selection of a basic rendering rule set adapted to the current client's domestic IT environment from multiple preset rendering rule sets. For example, for domestic browsers with a Gecko-type kernel, the "-moz-" prefix parsing mode is switched, and the detection thresholds for features such as Cascading Style Sheets (CSS) transformations and animations are adjusted. The version compatibility judgment standard is adapted to the domestic IT customized version of this kernel, ultimately determining the basic rendering rule set adapted to the current client environment.
[0145] (2) Based on the basic rendering rule set, perform environment-aware rendering operations on the business code of the front-end application to generate basic rendering results.
[0146] In this embodiment, based on the basic rendering rule set, environment-aware rendering operations are performed on the business code of the front-end application. According to the requirements of the basic rendering rule set, the prefix adaptation method in the style definition, the feature calling strategy in the business logic, and the compatible rendering scheme of the page structure are automatically adjusted to ensure that the various functional characteristics in the code match the kernel type and version of the client's domestically developed browser, generating a basic rendering result that meets the rendering requirements of the current environment. For example, for the rule set of the Gecko kernel, page transformations and animation styles are replaced with the "-moz-" prefix, and the rendering parameters of the animation time curve are adjusted to ultimately generate a basic rendering result that meets the rendering requirements of the current domestically developed browser environment.
[0147] (3) Based on the client runtime environment characteristic data, call the corresponding version of service resources in the target container instance to determine the target input resources that are adapted to the client's information technology innovation environment.
[0148] In this embodiment, based on the client's runtime environment characteristic data, the service resources of the corresponding version in the target container instance are called. That is, from the successfully matched target container instances, service resources that are consistent with the front-end application version and adapted to the current client's information technology innovation environment are selected as the target input resources for subsequent processing.
[0149] In this embodiment, regarding the service resources for syntax version adaptation: for older browsers (such as IE kernel, older WebKit), inject ES5 syntax polyfill files; for newer modern browsers, inject ES6+ modular code to improve performance.
[0150] In this embodiment, regarding operating system-specific repair service resources: for a specific Kylin OS version (such as Kylin V10 SP1), inject patch style sheets to fix known CSS compatibility issues. For example, the injected patch style sheets may contain adaptive rules for the abnormal min-width of flex layout child items in this environment, or add the -webkit- prefix to specific transition properties.
[0151] In this embodiment, regarding CPU architecture optimization service resources: Optimized JavaScript libraries or WebAssembly modules are injected for different CPU architectures. For example, a SIMD vectorized computing library is injected for the ARM64 architecture, and memory access optimization utility functions are injected for the Loongson architecture.
[0152] (4) Based on the basic rendering results and the target input resources, perform dynamic resource injection operations to generate response result data that is adapted to the client's information technology innovation architecture.
[0153] In this embodiment, as Figure 5 The diagram illustrates the loading of dynamic resource injection in this embodiment of the invention. Using the basic rendering result as a carrier, a dynamic resource injection operation is performed to integrate the target input resources into the basic rendering result. For the Kunpeng environment, Kunpeng resource packages, such as the ES6+ vectorized script, Kylin V10 repair style, and ARM vectorized computing module (ARM-SIMD module), obtained from the target container instance, are injected into the corresponding code segments of the basic rendering result as needed.
[0154] In this embodiment, for the Loongson environment, Loongson resource packages such as ES5 compatible files (ES5 full polyfill), old browser repair resources and memory optimization tool functions (downgraded UI components) are injected into the basic rendering results to supplement the running support of low version environments.
[0155] In this embodiment, for the Zhaoxin environment, the AVX2 optimization library, the Tongxin system adaptation style sheet (Tongxin OS adaptation), and the x64 parallel computing module are injected.
[0156] In this embodiment, if architectures such as Kunpeng, Loongson, and Zhaoxin are not applicable, the basic compatibility scripts and cross-browser repair styles in the general adaptation package are injected into the basic rendering results.
[0157] In this embodiment, the Node.js service in the target container instance performs environment-aware rendering operations and dynamic resource injection operations to complete the injection rendering of the front-end application, ensuring that the final generated response data is adapted to the client's domestic IT innovation architecture and can achieve stable operation and consistent rendering.
[0158] In this embodiment, through the above steps S101-S104, a complete optimization loop of "client environment collection → edge gateway intelligent routing → server-side dynamic rendering → client-side optimized experience" is formed. Simultaneously, this architecture enables the front-end application to possess operational capabilities similar to back-end microservices. The method further includes:
[0159] (1) Monitor the running status data of each application container instance in real time; the running status data includes one or more of the following: performance index data, error rate data, and resource utilization rate data.
[0160] (2) During the release of a new version of the front-end application, a gradual gray release operation is performed on the front-end application according to the dimension of the information technology innovation environment. The new version of the front-end application is released to the application container instance of the single target information technology innovation architecture (such as Kunpeng architecture) first, and the gray release verification results of each application container instance are output.
[0161] (3) If the verification result of the canary release of the application container instance shows an anomaly, or if the application container instance with an abnormal operation is found based on the running status data of each application container instance, a minute-level fast rollback operation is performed, that is, the version of the service resources in the application container instance with an abnormal operation is restored to the historical version, so as to quickly stop the loss of the anomaly.
[0162] (4) If the gray release verification result of the application container instance is normal, and no abnormal application container instance is found according to the running status data of the application container instance, then the version upgrade operation of the application container instance is executed, and the new version is gradually promoted to application container instances of other target information technology innovation architectures, and the full upgrade of the adaptation resources is completed simultaneously.
[0163] In this embodiment, as Figure 6The diagram illustrates another flowchart of the multi-architecture front-end application container adaptation method in this embodiment of the invention. Different domestic IT clients (such as Loongson terminals or Kunpeng terminals) send HTTP request signals to the server. The edge gateway performs basic parsing operations (i.e., UA parsing) on the HTTP request signals to extract basic information data about the client's runtime environment. Based on the client environment fingerprint data and the client runtime environment basic information data, multi-dimensional domestic IT environment fingerprint information data is generated (i.e., fingerprint generation). Based on the multi-dimensional domestic IT environment fingerprint information data, the HTTP request signal is dynamically routed to the target container instance (such as a Kunpeng instance or a Loongson instance). The target container instance performs environment-aware rendering operations and dynamic resource injection operations, completing the front-end application rendering (SSR) on the server. The server-side rendering engine can accurately perceive the domestic IT environment fingerprint of the current request and dynamically inject the most suitable resources into the final generated HTML response (i.e., dynamic resource injection) to generate response result data adapted to the client's domestic IT architecture, and then return this response result data to the client.
[0164] To better illustrate the multi-architecture front-end application container adaptation method of this application, the following embodiments are provided for explanation:
[0165] Example 1 - Optimized Deployment of Front-End Applications on the Kunpeng Platform:
[0166] During the build phase, the CI / CD pipeline monitors the front-end application's code repository in real time. Once any updates or modifications are detected, a multi-architecture image build task is automatically triggered (capable of simultaneously adapting to different target IT architectures such as Kunpeng, Loongson, and Zhaoxin). For the target IT architecture of Kunpeng (e.g., ARM64), leveraging Docker Manifest features, an optimized Node.js 20.11.0 runtime version corresponding to the Kunpeng architecture is selected. System dependencies include the kunpeng-ssl-accel hardware encryption / decryption library and the kunpeng-math-optimized math library. Based on the front-end application's business code and its dependent runtime resources, encapsulation operations are performed to build the container image. After the build is complete, the container image is tagged as frontend-app:v1.2.3-kunpeng-optimized and pushed to the image repository. Here, frontend-app is the front-end application image name, v1.2.3 is the application version number, and kunpeng-optimized identifies the image as an optimized version for the Kunpeng architecture.
[0167] During the deployment phase, the container image is deployed to the target domestic IT architecture corresponding to the server and the startup command is executed to generate a runnable application container instance that adapts the current version of the front-end application to the Kunpeng architecture. The application container instance is automatically associated with the architecture tag of the container image.
[0168] During the request processing phase, the Chrome 105 browser on the Kunpeng server accesses the application. The edge gateway parses the User-Agent in the request header, identifies it as ARM64 + Kylin V10 + Chrome 105, and generates multi-dimensional fingerprint information data of the domestic IT innovation environment based on this. The edge gateway queries the service mesh and finds that the application container instance with the architecture tag kunpeng-optimized has the highest matching degree, and routes the request to the target container instance.
[0169] During the rendering response phase, the Node.js service in the target container instance receives the HTTP request signal forwarded by the edge gateway. Based on the accompanying multi-dimensional fingerprint information of the domestic IT innovation environment, it is determined to be a modern browser + ARM64 architecture, and dynamically injects ES6 modular code, ARM NEON optimization library and Kylin V10 CSS fix.
[0170] Example 2 - Loongson Platform Compatibility Assurance:
[0171] A Loongson 3A5000 terminal, running Kylin V10 SP1 and accessing the same application via an older compatible browser, injects a lightweight JavaScript environment probe code (i.e., an injection probe) into the client's response. This probe code executes in the client's browser and detects that the CPU class contains "LoongArch," indicating the browser is in IE compatibility mode. Based on this, it generates multi-dimensional domestic IT environment fingerprint information. Using this fingerprint, the edge gateway queries and routes the request to the target container instance. The Node.js service in the target container instance is injected with a complete ES5 polyfill, Loongson memory access optimization utility functions, and CSS fixes for Kylin IE compatibility mode. Although the performance is inferior to the Kunpeng version, the functionality is complete and usable.
[0172] Example 3 - Fault Rollback and Degradation:
[0173] When a Phytium ARM64 terminal accesses the site, there are no Phytium-optimized instances in the cluster. The edge gateway selects a container instance labeled 'General ARM64 Optimized' as the degradation target based on a matching algorithm. This instance uses a general optimization library across the ARM64 platform to ensure compatibility. The monitoring system records this degradation route and triggers an alert to prompt the administrator to build a Phytium-optimized image.
[0174] It is worth noting that the multi-architecture front-end application container adaptation method of the present invention has the following advantages:
[0175] (1) Significant performance improvement: By building container images for the same version of the front-end application that are applicable to different types of target information technology innovation architectures, the optimized Node.js runtime version and system dependency library corresponding to each target information technology innovation architecture are integrated, which improves the performance of the front-end application on the information technology innovation platform and gives full play to the potential of domestic hardware.
[0176] (2) Compatibility is guaranteed: Through runtime environment-aware rendering and dynamic resource injection mechanism, the rendering rules can be automatically adjusted according to the actual running environment of the client, ensuring that the front-end application can work normally under different information technology innovation environments (different CPU, OS, browser combinations) and provide a consistent user experience.
[0177] (3) Resource utilization optimization: Based on the multi-dimensional information fingerprint data of the information technology innovation environment, the edge gateway intelligently routes the HTTP request signal to the target container instance with the highest tag matching degree, avoids resource mismatch, and enables the resources of each architecture-optimized instance in the cluster to be used efficiently, thereby improving the overall resource utilization and operating efficiency of the cluster.
[0178] (4) Enhanced operation and maintenance capabilities: The front-end application is deployed as a container instance, enabling it to have deployment, monitoring, canary release, and rollback capabilities similar to back-end microservices. It can manage application versions and running status, improving operability and security in the sensitive environment of information technology innovation.
[0179] (5) Zero intrusion into business code: All adaptation logic is completed in the delivery chain (build, gateway, rendering engine), and developers can obtain multi-architecture optimization support without modifying business code, reducing development and maintenance costs.
[0180] Furthermore, this invention is based on open-source technology stacks such as Docker, Kubernetes, Envoy, and NGINX, and does not rely on specific commercial products or foreign closed-source middleware, thus meeting the requirements of independent controllability in the domestic IT innovation industry. It can also quickly adapt to new domestic IT innovation platforms and environmental characteristics by updating the environment feature library, optimizing the resource repository and routing strategies, resulting in strong system scalability.
[0181] It should be noted that, in the embodiments of this application, the words "exemplary" or "for example" indicate examples, illustrations, or descriptions. Any embodiment or design described as "exemplary" or "for example" in this application should not be construed as being more preferred or advantageous than other embodiments or designs. Specifically, the use of words such as "exemplary" or "for example" is intended to present the relevant concepts in a concrete manner.
[0182] In this application embodiment, "at least one" refers to one or more, and "more than one" refers to two or more. "And / or" describes the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can represent: A alone, A and B simultaneously, or B alone, where A and B can be singular or plural. The character " / " generally indicates that the preceding and following related objects are in an "or" relationship. "At least one of the following" or similar expressions refer to any combination of these items, including any combination of single or plural items. For example, at least one of a, b, or c can represent: a, b, c, ab, ac, bc, or abc, where a, b, and c can be single or multiple.
[0183] Figure 7 This is a schematic block diagram of the multi-architecture front-end application container adaptation system provided in the embodiments of this application. Figure 7 As shown, the multi-architecture front-end application container adaptation system 700 includes:
[0184] The multi-architecture application container building module 701 is used to build multiple runnable application container instances for the same version of the front-end application based on the types of multiple target information technology innovation architectures, and to determine the architecture tag corresponding to each application container instance.
[0185] The environment identification module 702 is used to respond to the HTTP request signal initiated by the client and perform hierarchical environment identification operations to generate multi-dimensional information fingerprint data of the information technology innovation environment.
[0186] The container matching module 703 is used to perform an environment fingerprint matching calculation operation based on the multi-dimensional information technology innovation environment fingerprint information data and the architecture tag corresponding to each application container instance, so as to determine the application container instance that matches the client's information technology innovation environment; wherein, the application container instance that matches the client's information technology innovation environment is taken as the target container instance.
[0187] The environment rendering and resource injection module 704 is used to route the HTTP request signal to the target container instance so that the target container instance performs environment-aware rendering operations and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture.
[0188] It should be understood that the specific process of each module performing the above-mentioned steps has been described in detail in the above method embodiments, and will not be repeated here for the sake of brevity.
[0189] It should also be understood that the module division in the embodiments of this application is illustrative and only represents a logical functional division; in actual implementation, there may be other division methods. Furthermore, the functional modules in the various embodiments of this application can be integrated into a single processor, exist as separate physical entities, or be integrated into a single module. The integrated modules described above can be implemented in hardware or as software functional modules.
[0190] Figure 8 This is a schematic block diagram of an electronic terminal provided in an embodiment of this application. The electronic terminal includes a memory, a processor, and a computer program stored in the memory. The processor executes the computer program to implement the multi-architecture front-end application container adaptation method described above. Figure 8 As shown, the electronic terminal 800 includes at least one processor 801, a memory 802, at least one network interface 803, and a user interface 805. The various components in the device are coupled together via a bus system 804. It is understood that the bus system 804 is used to implement communication between these components. In addition to a data bus, the bus system 804 also includes a power bus, a control bus, and a status signal bus. However, for clarity, in… Figure 8 The general will label all buses as bus systems.
[0191] The user interface 805 may include a monitor, keyboard, mouse, trackball, clicker, button, touchpad, or touch screen.
[0192] It is understood that memory 802 can be volatile memory or non-volatile memory, or both. Non-volatile memory can be read-only memory (ROM) or programmable read-only memory (PROM), which serves as an external cache. By way of example, but not limitation, many forms of RAM are available, such as static random access memory (SRAM) and synchronous static random access memory (SSRAM). The memories described in the embodiments of this invention are intended to include, but are not limited to, these and any other suitable categories of memory.
[0193] In this embodiment of the invention, the memory 802 is used to store various types of data to support the operation of the electronic terminal 800. Examples of this data include: any executable program for operation on the electronic terminal 800, such as the operating system 8021 and application programs 8022; the operating system 8021 contains various system programs, such as the framework layer, core library layer, driver layer, etc., for implementing various basic services and handling hardware-based tasks. The application program 8022 may contain various applications, such as a media player, browser, etc., for implementing various application services. The multi-architecture front-end application container adaptation method provided in this embodiment of the invention can be included in the application program 8022.
[0194] The methods disclosed in the above embodiments of the present invention can be applied to or implemented by processor 801. Processor 801 may be an integrated circuit chip with signal processing capabilities. In the implementation process, each step of the above method can be completed by the integrated logic circuit of the hardware in processor 801 or by instructions in software form. The processor 801 may be a general-purpose processor, a digital signal processor (DSP), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. Processor 801 can implement or execute the methods, steps, and logic block diagrams disclosed in the embodiments of the present invention. General-purpose processor 801 may be a microprocessor or any conventional processor, etc. The steps of the accessory optimization method provided in the embodiments of the present invention can be directly reflected as being executed by a hardware decoding processor, or being executed by a combination of hardware and software modules in the decoding processor. The software module may be located in a storage medium, which is located in memory. The processor reads the information in the memory and combines it with its hardware to complete the steps of the aforementioned method.
[0195] In an exemplary embodiment, the electronic terminal 800 may be used by one or more application-specific integrated circuits (ASICs), DSPs, programmable logic devices (PLDs), or complex programmable logic devices (CPLDs) to perform the aforementioned method.
[0196] According to the method provided in the embodiments of this application, this application also provides a computer-readable storage medium having a computer program stored thereon, wherein the computer program, when executed by a processor, implements the method described above. Figures 1 to 6 The method of any of the embodiments shown.
[0197] According to the method provided in the embodiments of this application, this application also provides a computer program product, which includes computer program code. When the computer program code is run on a computer, it causes the computer to perform the following... Figures 1 to 6 The method of any of the embodiments shown.
[0198] As used in this specification, the terms "component," "module," "system," etc., are used to refer to computer-related entities, hardware, firmware, combinations of hardware and software, software, or software in execution. For example, a component can be, but is not limited to, a process running on a processor, a processor, an object, an executable file, an execution thread, a program, and / or a computer. As illustrated, applications running on computing devices and computing devices can both be components. One or more components may reside in a process and / or an execution thread, and components may be located on a single computer and / or distributed among two or more computers. Furthermore, these components can be executed from various computer-readable media on which various data structures are stored. Components can communicate, for example, via local and / or remote processes based on signals having one or more data packets (e.g., data from two components interacting with another component between a local system, a distributed system, and / or a network, such as the Internet interacting with other systems via signals).
[0199] Those skilled in the art will recognize that the various illustrative logical blocks and steps described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, or a combination of computer software and electronic hardware. Whether these functions are implemented in hardware or software depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementations should not be considered beyond the scope of this application.
[0200] Those skilled in the art will understand that, for the sake of convenience and brevity, the specific working processes of the systems, devices, and units described above can be referred to the corresponding processes in the foregoing method embodiments, and will not be repeated here.
[0201] In the several embodiments provided in this application, it should be understood that the disclosed systems, apparatuses, and methods can be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative; for instance, the division of units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the coupling or direct coupling or communication connection shown or discussed may be through some interfaces; the indirect coupling or communication connection between apparatuses or units may be electrical, mechanical, or other forms.
[0202] The units described as separate components may or may not be physically separate. The components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the units can be selected to achieve the purpose of this embodiment according to actual needs.
[0203] In addition, the functional units in the various embodiments of this application can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit.
[0204] In the above embodiments, the functions of each functional unit can be implemented entirely or partially through software, hardware, firmware, or any combination thereof. When implemented using software, it can be implemented entirely or partially in the form of a computer program product. A computer program product includes one or more computer instructions (programs). When the computer program instructions (programs) are loaded and executed on a computer, all or part of the flow or function according to the embodiments of this application is generated. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable device. Computer instructions can be stored in a computer-readable storage medium or transmitted from one computer-readable storage medium to another. For example, computer instructions can be transmitted from one website, computer, server, or data center to another website, computer, server, or data center via wired (e.g., coaxial cable, fiber optic, digital subscriber line (DSL)) or wireless (e.g., infrared, wireless, microwave, etc.) means. The computer-readable storage medium can be any available medium that a computer can access or a data storage device such as a server or data center that integrates one or more available media. The available media can be magnetic media (e.g., floppy disks, hard disks, magnetic tapes), optical media (e.g., high-density digital video discs, DVDs), or semiconductor media (e.g., solid-state disks, SSDs, etc.).
[0205] If a function is implemented as a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, or a part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods of the various embodiments of this application. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.
[0206] The above description is merely a specific embodiment of this application, but the scope of protection of this application is not limited thereto. Any variations or substitutions that can be easily conceived by those skilled in the art within the technical scope disclosed in this application should be included within the scope of protection of this application. Therefore, the scope of protection of this application should be determined by the scope of the claims.
[0207] In summary, this application provides a method, system, medium, product, and terminal for adapting multi-architecture front-end application containers. By building container images for the same version of the front-end application that are applicable to different types of target domestic IT innovation architectures, and relying on runtime environment-aware rendering and dynamic resource injection mechanisms, it ensures that the front-end application can work normally in different domestic IT innovation environments, providing a consistent user experience. Furthermore, by leveraging the intelligent routing capabilities of the edge gateway based on the fingerprint of the domestic IT innovation environment, it avoids resource mismatch, improves cluster resource utilization, and deploys the front-end application as a container instance, giving it deployment, monitoring, canary release, and rollback capabilities similar to back-end microservices. It can manage application versions and runtime status, improving operability and security in the sensitive domestic IT innovation environment. Therefore, this application effectively overcomes the various shortcomings of existing technologies and has high industrial application value.
[0208] The above embodiments are merely illustrative of the principles and effects of this application and are not intended to limit this application. Any person skilled in the art can modify or alter the above embodiments without departing from the spirit and scope of this application. Therefore, all equivalent modifications or alterations made by those skilled in the art without departing from the spirit and technical concept disclosed in this application should still be covered by the claims of this application.
Claims
1. A method for adapting multi-architecture front-end application containers, characterized in that, Applied to the server side, where the server communicates with the client, the multi-architecture front-end application container adaptation method includes: Based on the types of multiple target information technology innovation architectures, multiple runnable application container instances are built for the same version of the front-end application, and the architecture tag corresponding to each application container instance is determined. In response to the HTTP request signal initiated by the client, a hierarchical environment identification operation is performed to generate multi-dimensional fingerprint information data of the domestic IT innovation environment; Based on the multi-dimensional information fingerprint data of the domestic IT innovation environment, and based on the architecture tag corresponding to each application container instance, an environment fingerprint matching calculation operation is performed to determine the application container instance that matches the client's domestic IT innovation environment; wherein, the application container instance that matches the client's domestic IT innovation environment is taken as the target container instance; The HTTP request signal is routed to the target container instance, so that the target container instance performs environment-aware rendering operations and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture.
2. The multi-architecture front-end application container adaptation method according to claim 1, characterized in that, Based on the types of multiple target information technology innovation architectures, the methods for building multiple runnable application container instances for the same version of the front-end application and determining the architecture tag corresponding to each application container instance include: Based on the types of multiple target information technology innovation architectures, select the optimized Node.js runtime version and system dependency libraries corresponding to each target information technology innovation architecture; Based on the optimized Node.js runtime version and system dependency libraries corresponding to each target IT innovation architecture, and based on the business code of the front-end application and the runtime resources that the front-end application depends on, a packaging operation is performed to build multiple container images for the same version of the front-end application; wherein each container image is applicable to one target IT innovation architecture; Each of the container images is deployed to the applicable target information technology innovation architecture and started to run, so as to build multiple runnable application container instances for the same version of the front-end application, and to determine the architecture tag corresponding to each application container instance.
3. The multi-architecture front-end application container adaptation method according to claim 1, characterized in that, The server is deployed with an edge gateway; wherein, in response to an HTTP request signal initiated by the client, the edge gateway performs a hierarchical environment identification operation to generate multi-dimensional information fingerprint data of the domestic IT innovation environment, the method of which includes: Detect whether the HTTP request signal contains a predefined domestic IT environment identifier header; If the HTTP request signal contains a predefined information technology innovation environment identifier header, then the multi-dimensional information technology innovation environment fingerprint information data is directly extracted from the information technology innovation environment identifier header; If the HTTP request signal does not contain a predefined domestic IT innovation environment identifier header, then the client environment fingerprint data is obtained based on the session ID, and multi-dimensional domestic IT innovation environment fingerprint information data is generated based on the client environment fingerprint data.
4. The multi-architecture front-end application container adaptation method according to claim 3, characterized in that, The methods for generating the client environment fingerprint data include: For the first HTTP request signal, perform basic parsing operations to extract basic information data about the client's runtime environment; Based on the basic information data of the client's operating environment, an injection probe operation is performed to generate client environment fingerprint data.
5. The multi-architecture front-end application container adaptation method according to claim 1, characterized in that, The target container instance is configured with different versions of service resources; wherein, the method of routing the HTTP request signal to the target container instance so that the target container instance performs environment-aware rendering operations and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture, includes: The HTTP request signal is routed to the target container instance, so that the target container instance can identify the client's runtime environment characteristic data based on the multi-dimensional domestic IT innovation environment fingerprint information data, and call the corresponding version of service resources based on the client's runtime environment characteristic data to perform environment-aware rendering operations and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture.
6. The multi-architecture front-end application container adaptation method according to claim 5, characterized in that, Based on the client's runtime environment characteristic data, the methods for invoking the corresponding version of service resources to perform environment-aware rendering operations and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture, include: Based on the client's runtime environment characteristic data, select an appropriate basic rendering rule set from multiple preset rendering rule sets; Based on the aforementioned basic rendering rule set, environment-aware rendering operations are performed on the business code of the front-end application to generate basic rendering results; Based on the client runtime environment characteristic data, call the corresponding version of service resources in the target container instance to determine the target input resources that are adapted to the client's domestic IT innovation environment; Based on the basic rendering results and the target input resources, a dynamic resource injection operation is performed to generate response result data adapted to the client's domestic IT innovation architecture.
7. A multi-architecture front-end application container adaptation system, characterized in that, include: The multi-architecture application container building module is used to build multiple runnable application container instances for the same version of the front-end application based on the types of multiple target information technology innovation architectures, and to determine the architecture tag corresponding to each application container instance. The environment identification module is used to respond to HTTP request signals initiated by the client, perform hierarchical environment identification operations, and generate multi-dimensional information fingerprint data of the information technology innovation environment; The container matching module is used to perform an environment fingerprint matching calculation operation based on the multi-dimensional information fingerprint data of the information innovation environment and the architecture tag corresponding to each application container instance, so as to determine the application container instance that matches the client's information innovation environment; wherein, the application container instance that matches the client's information innovation environment is taken as the target container instance; The environment rendering and resource injection module is used to route the HTTP request signal to the target container instance, so that the target container instance performs environment-aware rendering operations and dynamic resource injection operations, thereby generating response result data adapted to the client's domestic IT innovation architecture.
8. A computer-readable storage medium having a computer program stored thereon, characterized in that, When the computer program is executed by a processor, it implements the multi-architecture front-end application container adaptation method as described in any one of claims 1 to 6.
9. A computer program product, characterized in that, The computer program product includes computer program code, which, when run on a computer, enables the computer to implement the multi-architecture front-end application container adaptation method as described in any one of claims 1 to 6.
10. An electronic terminal, comprising a memory, a processor, and a computer program stored in the memory, characterized in that, The processor executes the computer program to implement the multi-architecture front-end application container adaptation method as described in any one of claims 1 to 6.