How to reduce the memory usage and CPU occupation of web pages

Time:2021-6-9

Some pages is too laggy, but open will be very stuck. Some pages are very long, but they are fluent, and occupy the memory and CPU of the user’s computer.

There are browser problems, which can be affected by their own browser processing memory problems, but there is almost no way to control them

Ie series, refresh the amount of recycling is not large, but the minimum will release memory,.
It’s said that Firefox 2 will also minimize recycling, but I’ve never seen the most garbage, how much to use, basically no recycling. It is said that the Ajax of prototype will also cause the memory to increase continuously.
Opera is the best. Well controlled all the time. There is no problem..
The memory allocation mechanism of Linux is different from that of win. If the browser is full, it may kill the system.

Page problems, browser rendering page will consume memory and CPU, can reduce a little bit to reduce the point.

Structurally
Use DOCTYPE to tell the browser what you are using. Html4 also has DTD. Maybe transitional is better for you
If you are using XHTML and can maintain a good structure, remember to output the corresponding mime and XML header 1, which can reduce the code checking of the browser,
Keep the structure intact and don’t let the browser complete the code for you.
Control the file size of the page, through the program to see the code more comfortable indentation removed. 2-3K is the same size.
Iframe will generate new pages. In fact, there are many ways to replace iframe
The introduction of JS and CSS can be properly merged, the same background image can also be merged, and even some people even flash are merged
Adding the width attribute to the content image / object with known width and height can reduce the local re rendering of the page
Performance
For 99 and 70 quality JPG, in most cases, only the file size is different. GIF is the same, especially the small icon, 256 color and 128 color difference is the file size
Flash move too fast, eat CPU is very big, control the number of frames per second and animation effect can reduce some, if the quality with low and medium display will save a lot of resources, but this has sacrificed the effect.. Sometimes it is more suitable to select autolow2 or autohigh for the quality attribute. There is no need to keep low or best,
Flash uses vector graphics to save file size, but it takes CPU to compute complex graphics and animation. If there are too many complex filters, it will occupy a lot of memory, and the blur filter will be reduced by 3.
IE’s filter also takes up more memory, but it also has compatibility problems. Full screen translucency is resource intensive.
The 2 * 2 image is about the same size as the 8 * 8 image, but the tiled background 2 * 2 takes up a lot of space.
Gif animation also has the concept of frame, don’t take GIF as flash to play.
Behavior
Don’t introduce a whole prototype or jQuery just to use a $(), they have more functions.
AJAX is cool. However, using XML will use an XML parser. Some people recommend using JSON, but if you want to use Eval data, you can directly import the script that is already an object. Just pass multiple object names, or write them dead, or use them as functions like Flickr’s JSON flickrapi ({“XXX”: “XXX”}).
Some effects can be achieved with V isibility:hidden Don’t use it when you solve it display:none Go Play City Sports.
It’s not very meaningful to emphasize that JS variables should pay attention to the whole and the part. The complexity of JS can’t be explained in one or two sentences. Pay attention to the new books that are being published^^
In fact, many of the contents here are similar to how to quickly render our web pages, but that article focuses on processing the server, but in many cases, saving the resource consumption of the server will also save the resource consumption of the client.

In fact, this article has been squatting in the draft box for a long time, and there is no time to sort it out. Now it is not complete, because there is no complete, add it slowly.

——————————————————————————–

Problems: although it will cause browser mode problems, the problem can be solved. Referring to serving up XHTML with the correct MIME type, the delivery XML header browser will not display fault tolerance, and the wrong structure will cause the whole page to be unable to display.
Autolow: speed is a priority, but it also improves the look as much as possible. At the beginning of playback, antialiasing is off. Flash player turns on the antialiasing feature if it detects that the processor can handle it.
Autohigh: at the beginning, both playback speed and appearance should be emphasized. If necessary, appearance will be sacrificed to ensure playback speed. At the beginning of playback, antialiasing is on. If the actual frame rate falls below the specified frame rate, the antialiasing function will be turned off to improve the playback speed. Use this setting to simulate the antialiasing command (View > preview mode > antialiasing).
Blur filter: when using blur filter, if the value used for blurx and blury is an integer power of 2 (such as 2, 4, 8, 16 and 32), the calculation speed can be accelerated, and the performance can be improved by 20% to 30% (the help of flash is the introduction).