CN111444455A - Browser compatible method, system, computer device and storage medium - Google Patents
Browser compatible method, system, computer device and storage medium Download PDFInfo
- Publication number
- CN111444455A CN111444455A CN202010217819.9A CN202010217819A CN111444455A CN 111444455 A CN111444455 A CN 111444455A CN 202010217819 A CN202010217819 A CN 202010217819A CN 111444455 A CN111444455 A CN 111444455A
- Authority
- CN
- China
- Prior art keywords
- webpage
- target
- browser
- version
- server
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
- 238000000034 method Methods 0.000 title claims abstract description 29
- 238000009877 rendering Methods 0.000 claims abstract description 22
- 238000004590 computer program Methods 0.000 claims description 10
- 238000004806 packaging method and process Methods 0.000 claims description 5
- 238000004458 analytical method Methods 0.000 claims description 4
- 230000009286 beneficial effect Effects 0.000 abstract 1
- 238000013515 script Methods 0.000 description 20
- VYZAMTAEIAYCRO-UHFFFAOYSA-N Chromium Chemical compound [Cr] VYZAMTAEIAYCRO-UHFFFAOYSA-N 0.000 description 5
- 238000004364 calculation method Methods 0.000 description 5
- 238000010586 diagram Methods 0.000 description 5
- 230000006870 function Effects 0.000 description 5
- 230000003111 delayed effect Effects 0.000 description 4
- 238000005516 engineering process Methods 0.000 description 3
- 230000008569 process Effects 0.000 description 3
- 230000008859 change Effects 0.000 description 2
- 238000004891 communication Methods 0.000 description 2
- 230000007774 longterm Effects 0.000 description 2
- 238000012423 maintenance Methods 0.000 description 2
- 239000003607 modifier Substances 0.000 description 2
- 230000003287 optical effect Effects 0.000 description 2
- 238000005457 optimization Methods 0.000 description 2
- 238000012545 processing Methods 0.000 description 2
- 230000003068 static effect Effects 0.000 description 2
- 230000005540 biological transmission Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 230000006872 improvement Effects 0.000 description 1
- 230000010365 information processing Effects 0.000 description 1
- 238000010295 mobile communication Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/40—Transformation of program code
- G06F8/41—Compilation
- G06F8/42—Syntactic analysis
- G06F8/427—Parsing
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44536—Selecting among different versions
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Data Mining & Analysis (AREA)
- Information Transfer Between Computers (AREA)
Abstract
The invention discloses a browser compatible method, which comprises the following steps: acquiring kernel information of a target browser; creating a webpage loading instruction according to the kernel information, and sending the webpage loading instruction to a server; the server judges whether kernel information in the webpage loading instruction supports ES modules or not; the server obtains a webpage version package type corresponding to the target browser according to a judgment result, wherein the webpage version package type comprises a new version webpage package type and an old version webpage package type, and target webpage data returned by the server according to the webpage version package type are received; and analyzing and rendering the target webpage data to display the target webpage. The invention also discloses a browser compatible system, computer equipment and a storage medium. The embodiment of the invention has the beneficial effects that: the loading time is reduced, and the efficiency is improved.
Description
Technical Field
The embodiment of the invention relates to the technical field of computer information, in particular to a browser compatibility method, a browser compatibility system, computer equipment and a storage medium.
Technical Field
With the rapid development of the internet and the gradual improvement of the HTM L5 specification, the browser technology is widely applied, and is widely used in the existing emerging fields, such as smart phones and set-top boxes, besides the traditional PC field, and is the most frequently used client program.
Mainstream web browsers include Mozilla Firefox, Internet Explorer, Microsoft Edge, Google Chrome, Opera, and safari, but when existing browsers load a web page, compatibility problems may exist if the existing browsers do not match.
At present, the problem of browser compatibility is solved, and compatible codes compatible with the browser need to be added into codes of a webpage, but the codes of the webpage are huge and long, the page loading speed is low, and the blank screen is easy to realize in this way.
Disclosure of Invention
In view of this, an object of the embodiments of the present invention is to provide a browser compatible method, system, computer device and storage medium, which reduce loading time and improve efficiency.
To achieve the above object, an embodiment of the present invention provides a browser compatibility method, including:
acquiring kernel information of a target browser;
creating a webpage loading instruction according to the kernel information, and sending the webpage loading instruction to a server;
the server judges whether kernel information in the webpage loading instruction supports ES modules or not;
the server obtains a webpage version packet type corresponding to the target browser according to the judgment result, wherein the webpage version packet type comprises a new version webpage packet type and an old version webpage packet type
Receiving target webpage data returned by the server according to the webpage version packet type;
and analyzing and rendering the target webpage data to display the target webpage.
Further, creating a web page loading instruction according to the kernel information, and sending the web page loading instruction to a server includes:
acquiring a page loading request of a target webpage;
and packaging the kernel information and the page loading request to obtain the webpage loading instruction, and sending the webpage loading instruction to a server.
Further, the server obtains a webpage version package type corresponding to the target browser according to the judgment result, where the webpage version package type including a new version webpage package type and an old version webpage package type includes:
if the target browser supports ES modules, the server acquires the new version webpage packet type and loads target webpage data corresponding to the new version webpage packet type;
and if the target browser does not support ES modules, the server acquires the old version webpage packet type and loads target webpage data corresponding to the old version webpage packet type.
Further, parsing and rendering the target web page data to display the target web page includes:
analyzing the target webpage data according to the version type of the target browser to obtain a target webpage frame;
and rendering the target webpage frame to obtain the target webpage.
In order to achieve the above object, an embodiment of the present invention further provides a browser compatible system, including:
the first acquisition module is used for acquiring the kernel information of the target browser;
the creating module is used for creating a webpage loading instruction according to the kernel information and sending the webpage loading instruction to a server;
the judging module is used for judging whether the kernel information in the webpage loading instruction supports ESmodules or not by the server;
the second obtaining module is used for obtaining the webpage version package type corresponding to the target browser by the server according to the judgment result, wherein the webpage version package type comprises a new version webpage package type and an old version webpage package type;
the receiving module is used for receiving the target webpage data returned by the server according to the webpage version packet type;
and the analysis module is used for analyzing and rendering the target webpage data so as to display the target webpage.
Further, the obtaining module is further configured to:
acquiring a page loading request of a target webpage;
and packaging the kernel information and the page loading request to obtain the webpage loading instruction, and sending the webpage loading instruction to a server.
Further, the second obtaining module is further configured to:
if the target browser supports ES modules, the server acquires the new version webpage packet type and loads target webpage data corresponding to the new version webpage packet type;
and if the target browser does not support ES modules, the server acquires the old version webpage packet type and loads target webpage data corresponding to the old version webpage packet type.
Further, the parsing module is further configured to:
analyzing the target webpage data according to the version type of the target browser to obtain a target webpage frame;
and rendering the target webpage frame to obtain the target webpage.
To achieve the above object, an embodiment of the present invention further provides a computer device, which includes a memory and a processor, where the memory stores a computer program that is executable on the processor, and the computer program, when executed by the processor, implements the steps of the browser compatibility method as described above.
To achieve the above object, an embodiment of the present invention further provides a computer-readable storage medium, in which a computer program is stored, and the computer program is executable by at least one processor to cause the at least one processor to execute the steps of the browser compatible method as described above.
According to the browser compatible method, the browser compatible system, the computer device and the storage medium, whether kernel information in a webpage loading instruction supports ES modules or not is judged by obtaining the kernel information of a target browser, a webpage version packet type corresponding to the target browser is obtained according to a judgment result, and target webpage data are analyzed and rendered to generate a corresponding target webpage; the webpage version packet type is configured in advance, so that the speed is improved, the webpage version packet type comprises a version webpage packet type and an old version webpage packet type, the problem of browser compatibility is solved, and the design of a target webpage is improved.
Drawings
FIG. 1 is a flowchart illustrating a first browser compatibility method according to an embodiment of the present invention.
Fig. 2 is a flowchart of step S102 in a first embodiment of the browser compatibility method according to the present invention.
Fig. 3 is a flowchart of step S106 in a first embodiment of the browser compatible method according to the present invention.
Fig. 4 is a flowchart of step S110 in a first embodiment of the browser compatibility method according to the present invention.
FIG. 5 is a schematic diagram of program modules of a second browser compatible system according to an embodiment of the present invention.
Fig. 6 is a schematic diagram of a hardware structure of a third embodiment of the computer apparatus according to the present invention.
Detailed Description
In order to make the objects, technical solutions and advantages of the present invention more apparent, the present invention is described in further detail below with reference to the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are merely illustrative of the invention and are not intended to limit the invention. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present invention.
Example one
Referring to fig. 1, a flowchart illustrating steps of a browser compatible method according to a first embodiment of the present invention is shown. It is to be understood that the flow charts in the embodiments of the present method are not intended to limit the order in which the steps are performed. The following description is made by way of example with the computer device 2 as the execution subject. The details are as follows.
And step S100, acquiring the kernel information of the target browser.
Specifically, the kernel information may include information of a kernel type of the target browser, and may further include version information of the target browser, and the like. The kernel types of the target browser are various, and even the same target browser can adopt different kernel types due to different versions. The target browser may be a Mozilla Firefox, Internet Explorer, Microsoft Edge, Google Chrome, Opera, and Safari, among other browsers.
And step S102, creating a webpage loading instruction according to the kernel information, and sending the webpage loading instruction to a server.
Specifically, when a webpage needs to be loaded, the kernel information and the webpage loading request instruction are packaged to obtain a webpage loading instruction, and the webpage loading instruction is sent to the server to obtain corresponding target webpage data.
Exemplarily, referring to fig. 2, the step S102 further includes:
step S102A, a page loading request of the target web page is obtained.
Specifically, when a user needs to load a page, the user clicks a link address of the page and generates a page loading request according to the clicking operation.
Step S102B, encapsulating the kernel information and the page loading request to obtain the web page loading instruction, and sending the web page loading instruction to a server.
Specifically, a page loading request and kernel information are packaged into a webpage loading instruction, and access permission is limited by adding an access modifier so as to achieve the purpose of information hiding. And sending the webpage loading instruction to a server for analysis.
Step S104, the server judges whether the kernel information in the webpage loading instruction supports ESmodules.
Specifically, whether the kernel information of the target browser supports ES modules is determined by loading a preset code < script type ═ module >, where ES modules (ESM) are standardized module systems of JavaScript officials, and whether the browser is compatible with the characteristic is determined by the preset code.
And step S106, the server obtains a webpage version packet type corresponding to the target browser according to the judgment result, wherein the webpage version packet type comprises a new version webpage packet type and an old version webpage packet type.
Specifically, the server obtains the corresponding webpage version package type according to the judgment result so as to obtain the data of the webpage version package corresponding to the webpage version package type from a browser compatible version list, wherein the browser compatible version list comprises modern versions, patch versions and old versions of various browsers. The arrangement order of the browsers compatible with the version list can be changed without limitation.
Exemplarily, before acquiring the webpage version package type, a webpage version package type list is configured in advance; and configuring corresponding query conditions for the webpage version package according to the browser compatible version list.
Specifically, configuring corresponding query conditions for the browser compatible version list according to the browser characteristics. The browser that may be used is configured into the browser, and the browser may be configured according to conditions such as a browser usage rate, a browser version range, and the like, where the browser is limited by the following query conditions (case is not limited):
browser version range selected based on global usage statistics > 5%; the same applies for <, >;
5% in US, as above, except that the area of use was changed to the United states; and supports a country code of two letters to designate a region;
5% in alt-AS, just the area of use becomes all countries in Asia; all area codes are listed here;
> 5% in my stats using custom browser statistics;
99.5% of cover, namely a browser version with the sum of the utilization rate of 99.5%, on the premise that the browser provides the utilization coverage rate;
cover 99.5% in US, as above, only limits the region, supports the country code of two letters;
cover 99.5% in my stats using custom browser statistics;
main aid node versions, all node versions still maintained by the node Foundation;
node 10and node 10.4, the latest node 10.x.x or 10.4.x version;
current node is the node version currently used by the browserslist;
an extensions browser list-config-brand from a browser list-config-brand packet;
ie 6-8, selecting the version range of a browser;
firefox >20, all Firefox browser versions with versions higher than 20; the same applies for <, >;
ios 7, namely an ios 7 own browser;
firefox ESR, the latest Firefox ESR (Long-term support version) version of the browser;
alpha and beta versions;
last 2major version or last 2ios major version, the latest two releases including all minor version numbers and browser version with patch version number change;
sine 2015or last 2years, version updated since a certain time (more specific sine 2015-03 or sine 2015-03-10 that can also be written);
dead, a version of the browser version screened by last 2versions with global usage below 0.5% and official statements of no maintenance or indeed no further updates for two years; presently eligible are IE10, IE _ Mob10, BlackBerry 10, BlackBerry 7, OperaMobile 12.1;
last 2versions, the latest two versions of each browser;
last 2Chrome versions, two versions of Chrome browser closest;
defaults > 0.5% default configuration, last 2versions, Firefox ESR, not dead;
negation of the browser scope is carried out when not ie is 8;
a not may be added before the arbitrary query condition, indicating an inversion.
By setting the query conditions, the webpage version package is conveniently configured.
When the webpage version package is configured, the browsers in the browser compatible version list are divided into a new browser compatible version list and an old browser compatible version list. And configuring the new version webpage package according to the characteristics of the new version browser in the new browser compatible version list, and configuring the old version webpage package according to the characteristics of the old browser version in the old browser compatible version list. And generating compatible codes of the webpage version package according to the configuration of the browser compatible version list, so that the webpage version package is generated as required, and no surplus or little webpage version package is generated.
Exemplarily, referring to fig. 3, the step S106 further includes:
step S106A, if the target browser supports ES modules, the server obtains the new version webpage package type, and loads the target webpage data corresponding to the new version webpage package type.
Specifically, if the kernel information is a new version browser type, a new version webpage package type may be introduced by loading a code < script type ═ module >, and loading out webpage parameter information corresponding to the new version webpage package, while ignoring an old version webpage package type introduced in a manner of loading the code < script nomodule >.
Step S106B, if the target browser does not support ES modules, the server obtains the old version webpage package type, and loads the target webpage data corresponding to the old version webpage package type.
Specifically, if the kernel information is an old version browser type, the new version webpage package type is not supported, so that the new version webpage package type is not introduced through < script type ═ module >, but the webpage data corresponding to the supported old version webpage package can be introduced through loading the code < script nomode >.
Step S106C, the server acquires target webpage data corresponding to the target browser according to the webpage version package type.
Specifically, a webpage version package type list is configured in advance, and when the webpage version package type corresponding to the target browser is obtained, the webpage version package corresponding to the webpage version package type is loaded together. The web page version packet contains target web page data.
And step S108, receiving the target webpage data returned by the server according to the webpage version packet type.
Specifically, the server determines a corresponding webpage version package type according to the kernel information, queries corresponding target webpage parameter information in the webpage version package according to the webpage loading instruction and the webpage version package type, and sends the queried target webpage parameter information to the computer equipment.
Step S110, analyzing and rendering the target webpage data to display the target webpage.
Specifically, the target webpage data comprise parameter information required by the target browser, the target webpage data are analyzed to adapt to the version mode of the target browser to generate the target webpage, the target webpage data are rendered, mastering and control over the expression form of the target webpage are increased, and interestingness is increased.
Exemplarily, referring to fig. 4, the step S110 further includes:
step S110A, parsing the target web page data according to the version type of the target browser to obtain a target web page frame.
Specifically, when the target webpage is drawn, parsing is performed on the loaded target webpage data, and a corresponding internal data structure (such as a DOM tree of the HTM L, an (object) attribute table of the JS, a style rule of the CSS, and the like) is established to adapt to the version mode of the target browser, so that a target webpage frame is obtained.
Step S110B, rendering the target web page frame to obtain the target web page.
Specifically, a rendering tree is constructed, position calculation, style calculation and the like are performed on each element of the target webpage frame, then the page is rendered (which can be understood as a "drawing" element) according to the rendering tree, and the rendering rationalizes the target webpage frame.
Illustratively, the target webpage loading is also preceded by target webpage preloading:
the script of the target webpage can contain files of a plurality of modules, one page can contain files of a plurality of modules, and some main contents of the target webpage are loaded before the target webpage is completely loaded, so that better experience is provided for users, and waiting time is reduced. Otherwise, if the content of the target webpage is too large, the target webpage without the preloading technology will be displayed as a blank for a long time, and the corresponding user experience will be poor until all the content of the target webpage is loaded.
Preloading is a performance optimization technique that can be used to inform browsers that certain web page version packages are likely to be used in the future in advance. The preloading is simply to load all required web page version packs locally in advance, so that the web page version packs are directly cached from the cache when needed later. And preloading the webpage version package in a mode of setting a code < link rel ═ modelreload >.
In some browsers, the content of different target web pages is loaded at different stages of browser rendering with different priorities, which total five levels:
highest;
high Hight;
medium, etc.;
l ow low;
l owest is lowest;
the priority of the main resource HTM L and the CSS is highest, and the content of other target web pages is different in priority according to different situations.
JS scripts get different priorities depending on whether they are asynchronous, delayed or blocked in their location in the file:
1. the script that the network blocked before the first picture resource is a middle level in the network priority;
2. scripts that the network blocks after the first picture resource are low in network priority;
3. asynchronous/delayed/inserted scripts (wherever located) are very low in network priority;
pictures (with viewport visible) will get a higher priority (medium level) relative to pictures (low level) that are not visible in the viewport, so to some extent the browser will try not to load these pictures. The low priority pictures will get a priority boost when the layout is completely discovered by the viewport.
Example two
Referring to fig. 5, a program module diagram of a second browser compatible system according to the second embodiment of the present invention is shown. In the present embodiment, the browser-compatible system 20 may include or be divided into one or more program modules, which are stored in a storage medium and executed by one or more processors to implement the present invention and implement the above-described browser-compatible method. The program modules referred to in the embodiments of the present invention refer to a series of computer program instruction segments capable of performing specific functions, and are more suitable than the programs themselves for describing the execution process of the browser-compatible system 20 in the storage medium. The following description will specifically describe the functions of the program modules of the present embodiment:
the first obtaining module 200 is configured to obtain kernel information of a target browser.
Specifically, the kernel information may include information of a kernel type of the target browser, and may further include version information of the target browser, and the like. The kernel types of the target browser are various, and even the same target browser can adopt different kernel types due to different versions. The target browser may be a Mozilla Firefox, Internet Explorer, Microsoft Edge, Google Chrome, Opera, and Safari, among other browsers.
A creating module 202, configured to create a web page loading instruction according to the kernel information, and send the web page loading instruction to a server.
Specifically, when a webpage needs to be loaded, the kernel information and the webpage loading request instruction are packaged to obtain a webpage loading instruction, and the webpage loading instruction is sent to the server to obtain corresponding target webpage data.
Illustratively, the creation module 202 is further configured to:
and acquiring a page loading request of the target webpage.
Specifically, when a user needs to load a page, the user clicks a link address of the page and generates a page loading request according to the clicking operation.
And packaging the kernel information and the page loading request to obtain the webpage loading instruction, and sending the webpage loading instruction to a server.
Specifically, a page loading request and kernel information are packaged into a webpage loading instruction, and access permission is limited by adding an access modifier so as to achieve the purpose of information hiding. And sending the webpage loading instruction to a server for analysis.
The judging module 204 is configured to judge whether the kernel information in the web page loading instruction supports ESmodules or not by the server.
Specifically, whether the kernel information of the target browser supports ES modules is determined by loading a preset code < script type ═ module >, where ES modules (ESM) are standardized module systems of JavaScript officials, and whether the browser is compatible with the characteristic is determined by the preset code.
A second obtaining module 206, configured to, according to the determination result, the server obtain a webpage version package type corresponding to the target browser, where the webpage version package type includes a new version webpage package type and an old version webpage package type.
Specifically, the server obtains the corresponding webpage version package type according to the judgment result so as to obtain the data of the webpage version package corresponding to the webpage version package type from a browser compatible version list, wherein the browser compatible version list comprises modern versions, patch versions and old versions of various browsers. The arrangement order of the browsers compatible with the version list can be changed without limitation.
Exemplarily, before acquiring the webpage version package type, a webpage version package type list is configured in advance; and configuring corresponding query conditions for the webpage version package according to the browser compatible version list.
Specifically, configuring corresponding query conditions for the browser compatible version list according to the browser characteristics. The browser that may be used is configured into the browser, and the browser may be configured according to conditions such as a browser usage rate, a browser version range, and the like, where the browser is limited by the following query conditions (case is not limited):
browser version range selected based on global usage statistics > 5%; the same applies for <, >;
5% in US, as above, except that the area of use was changed to the United states; and supports a country code of two letters to designate a region;
5% in alt-AS, just the area of use becomes all countries in Asia; all area codes are listed here;
> 5% in my stats using custom browser statistics;
99.5% of cover, namely a browser version with the sum of the utilization rate of 99.5%, on the premise that the browser provides the utilization coverage rate;
cover 99.5% in US, as above, only limits the region, supports the country code of two letters;
cover 99.5% in my stats using custom browser statistics;
main aid node versions, all node versions still maintained by the node Foundation;
node 10and node 10.4, the latest node 10.x.x or 10.4.x version;
current node is the node version currently used by the browserslist;
an extensions browser list-config-brand from a browser list-config-brand packet;
ie 6-8, selecting the version range of a browser;
firefox >20, all Firefox browser versions with versions higher than 20; the same applies for <, >;
ios 7, namely an ios 7 own browser;
firefox ESR, the latest Firefox ESR (Long-term support version) version of the browser;
alpha and beta versions;
last 2major version or last 2ios major version, the latest two releases including all minor version numbers and browser version with patch version number change;
sine 2015or last 2years, version updated since a certain time (more specific sine 2015-03 or sine 2015-03-10 that can also be written);
dead, a version of the browser version screened by last 2versions with global usage below 0.5% and official statements of no maintenance or indeed no further updates for two years; presently eligible are IE10, IE _ Mob10, BlackBerry 10, BlackBerry 7, OperaMobile 12.1;
last 2versions, the latest two versions of each browser;
last 2Chrome versions, two versions of Chrome browser closest;
defaults > 0.5% default configuration, last 2versions, Firefox ESR, not dead;
negation of the browser scope is carried out when not ie is 8;
a not may be added before the arbitrary query condition, indicating an inversion.
By setting the query conditions, the webpage version package is conveniently configured.
When the webpage version package is configured, the browsers in the browser compatible version list are divided into a new browser compatible version list and an old browser compatible version list. And configuring the new version webpage package according to the characteristics of the new version browser in the new browser compatible version list, and configuring the old version webpage package according to the characteristics of the old browser version in the old browser compatible version list. And generating compatible codes of the webpage version package according to the configuration of the browser compatible version list, so that the webpage version package is generated as required, and no surplus or little webpage version package is generated.
Illustratively, the second obtaining module 206 is further configured to:
and if the target browser supports ES modules, the server acquires the new version webpage packet type and loads target webpage data corresponding to the new version webpage packet type.
Specifically, if the kernel information is a new version browser type, a new version webpage package type may be introduced by loading a code < script type ═ module >, and loading out webpage parameter information corresponding to the new version webpage package, while ignoring an old version webpage package type introduced in a manner of loading the code < script nomodule >.
And if the target browser does not support ES modules, the server acquires the old version webpage packet type and loads target webpage data corresponding to the old version webpage packet type.
Specifically, if the kernel information is an old version browser type, the new version webpage package type is not supported, so that the new version webpage package type is not introduced through < script type ═ module >, but the webpage data corresponding to the supported old version webpage package can be introduced through loading the code < script nomode >.
And the server acquires target webpage data corresponding to the target browser according to the webpage version packet type.
Specifically, a webpage version package type list is configured in advance, and when the webpage version package type corresponding to the target browser is obtained, the webpage version package corresponding to the webpage version package type is loaded together. The web page version packet contains target web page data.
And the receiving module 208 is configured to receive target webpage data returned by the server according to the webpage version packet type.
Specifically, the server determines the type of the corresponding webpage version package according to the kernel information, queries corresponding target webpage parameter information in the webpage version package according to the webpage loading instruction, and sends the queried target webpage parameter information to the computer device.
The parsing module 210 is configured to parse and render the target webpage data to display the target webpage.
Specifically, the target webpage data comprise parameter information required by the target browser, the target webpage data are analyzed to adapt to the version mode of the target browser to generate the target webpage, the target webpage data are rendered, mastering and control over the expression form of the target webpage are increased, and interestingness is increased.
Illustratively, the parsing module 210 is further configured to:
and analyzing the target webpage data according to the version type of the target browser to obtain a target webpage frame.
Specifically, when the target webpage is drawn, parsing is performed on the loaded target webpage data, and a corresponding internal data structure (such as a DOM tree of the HTM L, an (object) attribute table of the JS, a style rule of the CSS, and the like) is established to adapt to the version mode of the target browser, so that a target webpage frame is obtained.
And rendering the target webpage frame to obtain the target webpage.
Specifically, a rendering tree is constructed, position calculation, style calculation and the like are performed on each element of the target webpage frame, then the page is rendered (which can be understood as a "drawing" element) according to the rendering tree, and the rendering rationalizes the target webpage frame.
Illustratively, the parsing module 206 is further configured to:
performing target webpage preloading before target webpage loading:
the script of the target webpage can contain files of a plurality of modules, one page can contain files of a plurality of modules, and some main contents of the target webpage are loaded before the target webpage is completely loaded, so that better experience is provided for users, and waiting time is reduced. Otherwise, if the content of the target webpage is too large, the target webpage without the preloading technology will be displayed as a blank for a long time, and the corresponding user experience will be poor until all the content of the target webpage is loaded.
Preloading is a performance optimization technique that can be used to inform browsers that certain web page version packages are likely to be used in the future in advance. The preloading is simply to load all required web page version packs locally in advance, so that the web page version packs are directly cached from the cache when needed later. And preloading the webpage version package in a mode of setting a code < link rel ═ modelreload >.
In some browsers, the content of different target web pages is loaded at different stages of browser rendering with different priorities, which total five levels:
highest;
high Hight;
medium, etc.;
l ow low;
l owest is lowest;
the priority of the main resource HTM L and the CSS is highest, and the content of other target web pages is different in priority according to different situations.
JS scripts get different priorities depending on whether they are asynchronous, delayed or blocked in their location in the file:
1. the script that the network blocked before the first picture resource is a middle level in the network priority;
2. scripts that the network blocks after the first picture resource are low in network priority;
3. asynchronous/delayed/inserted scripts (wherever located) are very low in network priority;
pictures (with viewport visible) will get a higher priority (medium level) relative to pictures (low level) that are not visible in the viewport, so to some extent the browser will try not to load these pictures. The low priority pictures will get a priority boost when the layout is completely discovered by the viewport.
EXAMPLE III
Fig. 6 is a schematic diagram of a hardware architecture of a computer device according to a third embodiment of the present invention. In the present embodiment, the computer device 2 is a device capable of automatically performing numerical calculation and/or information processing in accordance with a preset or stored instruction. The computer device 2 may be a rack server, a blade server, a tower server or a rack server (including an independent server or a server cluster composed of a plurality of servers), and the like. As shown in FIG. 6, the computer device 2 includes, but is not limited to, at least a memory 21, a processor 22, a network interface 23, and a browser compatible system 20 communicatively coupled to each other via a system bus. Wherein:
in this embodiment, the memory 21 includes at least one type of computer-readable storage medium including a flash memory, a hard disk, a multimedia card, a card-type memory (e.g., SD or DX memory, etc.), a Random Access Memory (RAM), a Static Random Access Memory (SRAM), a Read Only Memory (ROM), an Electrically Erasable Programmable Read Only Memory (EEPROM), a Programmable Read Only Memory (PROM), a magnetic memory, a magnetic disk, an optical disk, and the like. In some embodiments, the storage 21 may be an internal storage unit of the computer device 2, such as a hard disk or a memory of the computer device 2. In other embodiments, the memory 21 may also be an external storage device of the computer device 2, such as a plug-in hard disk, a Smart Media Card (SMC), a Secure Digital (SD) Card, a Flash memory Card (Flash Card), or the like provided on the computer device 2. Of course, the memory 21 may also comprise both internal and external memory units of the computer device 2. In this embodiment, the memory 21 is generally used for storing an operating system installed in the computer device 2 and various application software, such as program codes of the browser-compatible system 20 in the second embodiment. Further, the memory 21 may also be used to temporarily store various types of data that have been output or are to be output.
The network interface 23 may comprise a wireless network interface or a wired network interface, and the network interface 23 is generally used for establishing communication connection between the server 2 and other electronic devices. For example, the network interface 23 is used to connect the server 2 to an external terminal via a network, establish a data transmission channel and a communication connection between the server 2 and the external terminal, and the like. The network may be a wireless or wired network such as an Intranet (Intranet), the Internet (Internet), a Global System of Mobile communication (GSM), Wideband Code Division Multiple Access (WCDMA), a 4G network, a 5G network, Bluetooth (Bluetooth), Wi-Fi, and the like. It is noted that fig. 6 only shows the computer device 2 with components 20-23, but it is to be understood that not all shown components are required to be implemented, and that more or less components may be implemented instead.
In this embodiment, the browser-compatible system 20 stored in the memory 21 may also be divided into one or more program modules, which are stored in the memory 21 and executed by one or more processors (in this embodiment, the processor 22) to complete the present invention.
For example, fig. 5 shows a schematic diagram of program modules of the second embodiment for implementing the browser-compatible system 20, in this embodiment, the browser-compatible system 20 may be divided into an obtaining module 200, a creating module 202, a determining module 204, a second obtaining module 206, a receiving module 208, and a parsing module 210. The program modules referred to herein are a series of computer program instruction segments that can perform specific functions, and are more suitable than programs for describing the execution of the browser-compatible system 20 on the computer device 2. The specific functions of the program modules 200 and 210 have been described in detail in the second embodiment, and are not described herein again.
Example four
The present embodiment also provides a computer-readable storage medium, such as a flash memory, a hard disk, a multimedia card, a card-type memory (e.g., SD or DX memory, etc.), a Random Access Memory (RAM), a Static Random Access Memory (SRAM), a read-only memory (ROM), an electrically erasable programmable read-only memory (EEPROM), a programmable read-only memory (PROM), a magnetic memory, a magnetic disk, an optical disk, a server, an App application mall, etc., on which a computer program is stored, which when executed by a processor implements corresponding functions. The computer-readable storage medium of the embodiment is used for storing a browser compatible system 20, and when being executed by a processor, the computer-readable storage medium implements the browser compatible method of the first embodiment.
According to the browser compatibility method, the browser compatibility system, the computer equipment and the storage medium, the kernel information of the target browser is obtained, the kernel information is generated into the webpage loading instruction and then is sent to the server to obtain the corresponding target webpage data, and the target webpage data is analyzed and rendered to generate the corresponding target webpage, so that the problem of browser compatibility is solved, the speed is improved, and the designability of the target webpage is improved; and a webpage version package is configured according to the browser compatible version list, and target webpage data can be acquired from the webpage version package when target webpages are generated subsequently, so that the efficiency is improved, and the time is saved.
The above-mentioned serial numbers of the embodiments of the present invention are merely for description and do not represent the merits of the embodiments.
Through the above description of the embodiments, those skilled in the art will clearly understand that the method of the above embodiments can be implemented by software plus a necessary general hardware platform, and certainly can also be implemented by hardware, but in many cases, the former is a better implementation manner.
The above description is only a preferred embodiment of the present invention, and not intended to limit the scope of the present invention, and all modifications of equivalent structures and equivalent processes, which are made by using the contents of the present specification and the accompanying drawings, or directly or indirectly applied to other related technical fields, are included in the scope of the present invention.
Claims (10)
1. A browser compatible method, comprising:
acquiring kernel information of a target browser;
creating a webpage loading instruction according to the kernel information, and sending the webpage loading instruction to a server;
the server judges whether kernel information in the webpage loading instruction supports ES modules or not;
the server obtains a webpage version packet type corresponding to the target browser according to the judgment result, wherein the webpage version packet type comprises a new version webpage packet type and an old version webpage packet type;
receiving target webpage data returned by the server according to the webpage version packet type;
and analyzing and rendering the target webpage data to display the target webpage.
2. The browser-compatible method of claim 1, wherein creating a web page load instruction from the kernel information and sending the web page load instruction to a server comprises:
acquiring a page loading request of a target webpage;
and packaging the kernel information and the page loading request to obtain the webpage loading instruction, and sending the webpage loading instruction to a server.
3. The method of claim 1, wherein the obtaining, by the server according to the determination result, the webpage version package type corresponding to the target browser, the webpage version package type including a new version webpage package type and an old version webpage package type includes:
if the target browser supports ES modules, the server acquires the new version webpage packet type and loads target webpage data corresponding to the new version webpage packet type;
and if the target browser does not support ES modules, the server acquires the old version webpage packet type and loads target webpage data corresponding to the old version webpage packet type.
4. The browser-compatible method of claim 1, wherein parsing and rendering the target web page data to display a target web page comprises:
analyzing the target webpage data according to the version type of the target browser to obtain a target webpage frame;
and rendering the target webpage frame to obtain the target webpage.
5. A browser-compatible system, comprising:
the first acquisition module is used for acquiring the kernel information of the target browser;
the creating module is used for creating a webpage loading instruction according to the kernel information and sending the webpage loading instruction to a server;
the judging module is used for judging whether the kernel information in the webpage loading instruction supports ESmodules or not by the server;
the second obtaining module is used for obtaining the webpage version package type corresponding to the target browser by the server according to the judgment result, wherein the webpage version package type comprises a new version webpage package type and an old version webpage package type;
the receiving module is used for receiving the target webpage data returned by the server according to the webpage version packet type;
and the analysis module is used for analyzing and rendering the target webpage data so as to display the target webpage.
6. The browser-compatible system of claim 5, wherein the obtaining module is further configured to:
acquiring a page loading request of a target webpage;
and packaging the kernel information and the page loading request to obtain the webpage loading instruction, and sending the webpage loading instruction to a server.
7. The browser-compatible system of claim 5, wherein the second obtaining module is further configured to:
if the target browser supports ES modules, the server acquires the new version webpage packet type and loads target webpage data corresponding to the new version webpage packet type;
and if the target browser does not support ES modules, the server acquires the old version webpage packet type and loads target webpage data corresponding to the old version webpage packet type.
8. The browser-compatible system of claim 5, wherein the parsing module is further configured to:
analyzing the target webpage data according to the version type of the target browser to obtain a target webpage frame;
and rendering the target webpage frame to obtain the target webpage.
9. A computer arrangement, characterized in that the computer arrangement comprises a memory, a processor, the memory having stored thereon a computer program being executable on the processor, the computer program, when executed by the processor, realizing the steps of the browser compatible method according to any one of claims 1-4.
10. A computer-readable storage medium, having stored therein a computer program executable by at least one processor to cause the at least one processor to perform the steps of the browser compatible method according to any one of claims 1 to 4.
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202010217819.9A CN111444455B (en) | 2020-03-25 | 2020-03-25 | Browser compatible method, system, computer device and storage medium |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202010217819.9A CN111444455B (en) | 2020-03-25 | 2020-03-25 | Browser compatible method, system, computer device and storage medium |
Publications (2)
Publication Number | Publication Date |
---|---|
CN111444455A true CN111444455A (en) | 2020-07-24 |
CN111444455B CN111444455B (en) | 2024-06-21 |
Family
ID=71629598
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202010217819.9A Active CN111444455B (en) | 2020-03-25 | 2020-03-25 | Browser compatible method, system, computer device and storage medium |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN111444455B (en) |
Cited By (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111984892A (en) * | 2020-08-27 | 2020-11-24 | 网易(杭州)网络有限公司 | Page access method, device, equipment and storage medium |
CN112558964A (en) * | 2020-11-27 | 2021-03-26 | 华帝股份有限公司 | Webpage generation method, computer equipment and storage medium |
CN112597423A (en) * | 2021-01-04 | 2021-04-02 | 聚好看科技股份有限公司 | Webpage content display method, terminal and server |
CN112637280A (en) * | 2020-12-10 | 2021-04-09 | 平安普惠企业管理有限公司 | Data transmission method and device, electronic equipment and storage medium |
CN113420245A (en) * | 2021-05-11 | 2021-09-21 | 上海幻电信息科技有限公司 | Page display method and system |
CN114546479A (en) * | 2022-04-25 | 2022-05-27 | 云账户技术(天津)有限公司 | Method and device for prompting incompatibility of browsers |
CN116595284A (en) * | 2023-07-13 | 2023-08-15 | 太平金融科技服务(上海)有限公司 | Webpage system operation method, device, equipment, storage medium and program |
Citations (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN109587210A (en) * | 2018-10-22 | 2019-04-05 | 太原市高远时代科技有限公司 | A kind of implementation method of the information push of more browser-safes |
CN110083383A (en) * | 2019-03-18 | 2019-08-02 | 平安普惠企业管理有限公司 | Browser style compatibility method, device, computer equipment and storage medium |
-
2020
- 2020-03-25 CN CN202010217819.9A patent/CN111444455B/en active Active
Patent Citations (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN109587210A (en) * | 2018-10-22 | 2019-04-05 | 太原市高远时代科技有限公司 | A kind of implementation method of the information push of more browser-safes |
CN110083383A (en) * | 2019-03-18 | 2019-08-02 | 平安普惠企业管理有限公司 | Browser style compatibility method, device, computer equipment and storage medium |
Non-Patent Citations (1)
Title |
---|
WEIXIN_33774615: "浏览器支持ES6的最优解决方案", pages 1 - 7, Retrieved from the Internet <URL:https://blog.csdn.net/weixin_33774615/article/details/88007114> * |
Cited By (11)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111984892A (en) * | 2020-08-27 | 2020-11-24 | 网易(杭州)网络有限公司 | Page access method, device, equipment and storage medium |
CN112558964A (en) * | 2020-11-27 | 2021-03-26 | 华帝股份有限公司 | Webpage generation method, computer equipment and storage medium |
CN112637280A (en) * | 2020-12-10 | 2021-04-09 | 平安普惠企业管理有限公司 | Data transmission method and device, electronic equipment and storage medium |
CN112637280B (en) * | 2020-12-10 | 2023-05-05 | 平安普惠企业管理有限公司 | Data transmission method, device, electronic equipment and storage medium |
CN112597423A (en) * | 2021-01-04 | 2021-04-02 | 聚好看科技股份有限公司 | Webpage content display method, terminal and server |
CN112597423B (en) * | 2021-01-04 | 2023-11-03 | 聚好看科技股份有限公司 | Webpage content display method, terminal and server |
CN113420245A (en) * | 2021-05-11 | 2021-09-21 | 上海幻电信息科技有限公司 | Page display method and system |
CN113420245B (en) * | 2021-05-11 | 2023-10-27 | 上海幻电信息科技有限公司 | Page display method and system |
CN114546479A (en) * | 2022-04-25 | 2022-05-27 | 云账户技术(天津)有限公司 | Method and device for prompting incompatibility of browsers |
CN116595284A (en) * | 2023-07-13 | 2023-08-15 | 太平金融科技服务(上海)有限公司 | Webpage system operation method, device, equipment, storage medium and program |
CN116595284B (en) * | 2023-07-13 | 2023-10-03 | 太平金融科技服务(上海)有限公司 | Webpage system operation method, device, equipment, storage medium and program |
Also Published As
Publication number | Publication date |
---|---|
CN111444455B (en) | 2024-06-21 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN111444455B (en) | Browser compatible method, system, computer device and storage medium | |
US9729499B2 (en) | Browser and method for domain name resolution by the same | |
EP2916243B1 (en) | Method, apparatus, server and system for implementing web application | |
CN108255701B (en) | Scene testing method and mobile terminal | |
CN112612982A (en) | Webpage preloading method and device and computer equipment | |
CN102402518A (en) | Method and device for accessing webpage | |
CN108021356B (en) | Cross-screen and cross-platform measurable live-action map organization method | |
CN111984902A (en) | Visual page configuration method, system, computer equipment and storage medium | |
CN108647032B (en) | Application loading method and device, computer device and computer readable storage medium | |
CN107798064B (en) | Page processing method, electronic device and computer readable storage medium | |
CN110874251B (en) | Method and device for realizing picture wooden barrel layout | |
CN112422450B (en) | Computer equipment, and flow control method and device for service request | |
CN108885544B (en) | Front-end page internationalized processing method, application server and computer-readable storage medium | |
CN116306531A (en) | Automatic HTML document filling method and device, electronic device and storage medium | |
CN109977677A (en) | Vulnerability information collection method, device, equipment and readable storage medium storing program for executing | |
CN110866202A (en) | Front-end paging method and device and readable storage medium | |
CN114064032A (en) | Source code processing method and device, electronic equipment and storage medium | |
CN112926002A (en) | Service request processing method and device | |
CN103258055A (en) | Device and method for file downloading | |
CN108829574B (en) | Test data laying method, test server and computer readable storage medium | |
CN113694523B (en) | Mobile terminal APP-based H5 game display method and device and computer equipment | |
CN116302328A (en) | Intelligent contract data processing method and system | |
CN113934954A (en) | Webpage first screen rendering method and device in application program | |
CN115470426A (en) | Browser kernel determining method and device, computer equipment and storage medium | |
CN114461960A (en) | Page generation method, page display method and device |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
TA01 | Transfer of patent application right |
Effective date of registration: 20220525 Address after: 518000 China Aviation Center 2901, No. 1018, Huafu Road, Huahang community, Huaqiang North Street, Futian District, Shenzhen, Guangdong Province Applicant after: Shenzhen Ping An medical and Health Technology Service Co.,Ltd. Address before: Room 12G, Area H, 666 Beijing East Road, Huangpu District, Shanghai 200001 Applicant before: PING AN MEDICAL AND HEALTHCARE MANAGEMENT Co.,Ltd. |
|
TA01 | Transfer of patent application right | ||
GR01 | Patent grant | ||
GR01 | Patent grant |