How to speed up page loading. How to significantly speed up page loading in your browser. Traffic consumption tracking
For webmasters and optimizers, site loading speed time is important. To confirm this, I would like to provide some statistics and facts:
- More than half of visitors leave a page that takes more than 3 seconds to load;
- A site that loads in 3 seconds has 25% fewer views, 50% more bounces, and 25% fewer conversions than a site that loads in 1 second;
- The progress bar increases the waiting time for the page to load;
- Loading speed directly affects sales and site position;
Determining the loading speed of a website is not difficult at all. For example, you can use the following popular online services:
Let's look at ways to speed up the loading time of website pages. In fact, all the methods are very simple and most often come down to optimizing the “weight” of the page and loading the code correctly.
There is quite a lot of material on this topic on the Internet. I tried to present all the methods compactly and only to the point. Let's begin.
1. Enable gzip compressionEach site has plug-in files with styles.css and scripts.js. They can be compressed on the fly (when the page loads). Simply put, we reduce their weight and thus the site loads faster. My files were compressed by 75% on average. For example, if a file weighed 45 kbytes, then after compression it began to weigh 12 kbytes. Total saving of 33 KB of weight on the file with the style sheet.
Enabling compression couldn't be easier. You just need to write following lines code in the .htaccess file (the file is located in the root of the site):
mod_gzip_on Yes mod_gzip_dechunk Yes mod_gzip_item_include file .(html?|txt|css|js|php|pl)$ mod_gzip_item_include mime ^text/.* mod_gzip_item_include mime ^application/x-javascript.* mod_gzip_item_exclude mime ^image/.* item_exclude rspheader ^Content -Encoding:.*gzip.*You can check whether compression is enabled on websites
If something doesn’t work out, then feel free to write a question to the technical support of your hosting. It often happens that they themselves have something not enabled in the server settings.
2. Enable browser cacheEnabling the browser cache is done by adding a couple of lines of code to the same .htaccess file:
Header append Cache-Control "public" FileETag MTime Size ExpiresActive On ExpiresDefault "access plus 0 minutes" ExpiresByType image/ico "access plus 1 years" ExpiresByType text/css "access plus 1 years" ExpiresByType text/javascript "access plus 1 years" ExpiresByType image/gif "access plus 1 years" ExpiresByType image/jpg "access plus 1 years" ExpiresByType image/jpeg "access plus 1 years" ExpiresByType image/bmp "access plus 1 years" ExpiresByType image/png "access plus 1 years"There is only an important problem: what cache storage period to set. If you set a very long time limit, and the file has changed, the browser will stubbornly load what it has in the cache. A way out of the situation could be to replace the file name and make changes to the template, but is this convenient? So it’s worth thinking about and determining for yourself how often you change files on the site.
My opinion is that in any case, a period of 1-7 days can always be set.
This is the simplest thing that could be done, let's move on.
You might be interested in:
3. Optimize your imagesUsing jpg images - for contrast and gif - where the number of colors is small. These are all axioms. Under no circumstances should you use png or bmp again, since both formats are not at all optimized.
Already existing jpg images and png can be easily compressed using programs and services. Personally, I searched the Internet for image compression services. I compared the results and concluded that I like the online service tinypng.com the most. Sometimes he manages to reduce the image by even 75%, while the quality remains almost unchanged.
If a site uses a large image as a background, it can be compressed very much. For example, I managed to compress a background image for one of the sites from 300 KB to 86 KB.
4. Upload files from another domainBrowsers have a limit on the number of simultaneously executed requests (no more than two in parallel). In other words, if the site has a bunch of images (even small ones), this will greatly increase its loading time. Therefore, use the following trick:
They create a subdomain for storing photos, javascript and more. For example, if previously the photo was located at /img/foto.jpg, now the address needs to be changed to img.site.ru/img/foto.jpg. For the browser it will be a different domain and with this artificial method we speed up loading.
NoteNowadays it's quite fashionable to use "CSS sprite". The meaning is as follows: for example, on our website we have a bunch of small pictures for the background (I think this is familiar to everyone). All these pictures can be combined into one large image, and using CSS you can “cut out” the necessary pieces in the right places.
5. CSS and JS optimizationOften, CSS and JS files contain a lot of unnecessary style descriptions, scripts, and even simple spaces and comments. This is additional weight for the site. You can easily get rid of this using the following services:
It seems like such a simple “fraud,” but this is a small bonus to reducing the page size.
6. Correct placement of CSS and JSWe include all .css files in the head tags (before the body tag), and we include all scripts at the end of the page. Generally speaking, this will not speed up page loading, but the content will begin to appear in front of the user earlier, and this in turn motivates him to wait, because he sees that the site is loading.
NoteIf you are loading an AJAX library (from Google), then, of course, loading it directly from Google’s website is faster, plus you can be almost 100% sure that the user’s browser already has its cache. But it happens that Google is not available for some reason or slows down the loading, so to minimize this risk you can write the following code:
window.jQuery || document.write("");The meaning is quite simple. First, we try to download the library directly from ajax.googleapis.com; if this fails, then we download a copy of the library from our website.
NoteIf you have a unique case where the site is still very heavy and takes a long time to load, then create a “progress bar” on your site. This shows the user that the site is loading and they just need to wait a little.
Marketing Director of one of the Optify divisions. Has 20 years of experience in launching various products and services in e-commerce, computer games and other areas.
Google ranking algorithms take into account page loading speed
On April 9, 2010, Google officially announced that their algorithms take into account page loading speed. Rumors had been circulating long before this - when the company began to emphasize speed with its Chrome products ( fast browser) and SPDY (fast web content transfer protocol) and promoting superfast broadband links. In this article, we will try to explain how Google determines speed and how you can test your page loading speed and improve it.
We believe that page loading speed is a great addition to the rest of the list of factors that determine page ranking in Google, and there are two main reasons for this:
1. Page loading speed is extremely important for user convenience. Research shows that the average user feels like a clock is ticking in their head as they wait for a page to open. With the increase in the speed of Internet use in general, expectations in terms of speed have also increased. You can read Google's post on internal speed testing and its impact. So,
2. Page loading speed is a factor that a developer can measure, track and optimize. Much in Google algorithm is beyond our control, but we can improve this indicator. Here are a few tools you can use to analyze your site's speed, as well as 6 tips to improve your page loading speed and rankings.
How does Google determine speed?
Two main methods for analyzing page load:
1. Response to Google bot. GoogleBot is an agent program that crawls links across the web, categorizing pages and content and sending it all to Google, which processes the data using its own algorithm. The Google bot simply collects information, it does not analyze or evaluate it. However, it has some limitations on how completely it will crawl a given page, since crawling through billions of pages takes a long time. This is one of the reasons why it is recommended to have “clean” code, place good content at the top of the page, and put repetitive code (like CSS) in separate files.
2. Loading time by according to Google Toolbar. Google is very aggressive in promoting and popularizing its free tools. One reason for this is the ability for Google to use its toolbar as a platform for analyzing individual sites and pages.
Tools for Measuring Page Speed
There are many free tools and plugins for measuring website performance. Here are a few of the best, in our opinion:
1. If you have an account with Google Webmaster (and you should have one), then you can use a special tool in the Labs section. It will allow you to get a general idea of how quickly your pages load relative to the pages of other sites in the statistics.
What does this algorithm change mean for you?
Improving page loading speed is not as critical as, say, proper title tags, URL structure, unique content, or quality inbound links. But all other things being equal, a page that loads faster has an advantage. Undoubtedly fast pages more convenient for users, which means an increase in visits, a decrease in unnecessary views and increasing the number of views per visit. Either way, it's best to do everything you can to ensure your pages load quickly.
6 Ways to Improve Page Loading Speed and Rank
1. Optimize images: Large images can be cropped, compressed and downloaded faster.
2. Instead of background images, use just colors: this will load faster.
3. Use a cache: caching is convenient for users, since pictures and other static files are loaded only on the first visit, and this is no longer required on subsequent visits.
4. Load external Javascript and callables last: The worst thing you can do is make your visitors wait for all the content to load at once. If possible, make sure your content loads first and external content loads after it.
5. Use separate files for repetitive code: Separate files are most often used with CSS style sheets and allow for lighter page html code (fewer lines of code) and also provide a central, easy-to-find file for making changes to important areas of code (e.g. style sheets).
6. To organize pages, use CSS styles instead of HTML tables: before loading the table itself, web browsers (IE, Firefox, etc.) wait for all its content to load. CSS makes this process faster (and easier to update).
1. Select one of the above tools and install it.
2. Test loading speed for the main page and several other pages of different types.
3. Determine which components can be improved. Discuss this with your technical staff and webmaster.
4. For comparison, run the same tests with competitors’ pages.
I hope all of the above will help you speed up the loading of your website pages - both users and search engines will appreciate it.
Without exception, all owners of Internet resources dream of high traffic and successful monetization of their projects. However, unfortunately, not everyone succeeds.
Do you want to be among the chosen ones and achieve your goals?
In this case, you will have to take care of many nuances: not only develop a concept, choose a suitable design, post useful content, but also increase the site loading speed.
Website performance is one of the important indicators that has a positive effect on ranking in search engines oh and conversion.
For example, every additional second of loading threatens a business with a loss of 7% of targeted actions! Amazon Analysis Data.
What's wrong with a slow website? It not only irritates, but also leads to serious problems in solving daily problems. Problems with page rendering 10 seconds after a click are a signal of a breakdown, which leads to user abandonment, decreased sales, and worsening behavioral factors.
There is also a technical side to the issue. If you overlook such an important indicator as loading speed, this will lead to an increase in the required amount of hosting resources and, accordingly, to additional costs. That is, work to improve productivity is justified from both economic and technical points of view.
In this article you will learn how to increase the loading speed of a website on any engine using the most effective methods.
Users do not like to wait: the slower the portal works, the lower their loyalty. Therefore, it is in your interests to speed up the site to the speed of a cheetah :).
And yet, what indicators should you focus on?
- 1 second is an excellent, but difficult to achieve result.
- 2–3 seconds is the standard response time for most successful resources.
- 3–5 seconds - small, but tolerable speed for some projects;
- 6–10 seconds - such a low indicator negatively affects promotion;
- from 11 seconds - a disastrous result, in which it is urgent to speed up the site.
Attention! The above is summarized data. The ideal numbers for each specific case depend on the location, functionality, volume and type of site.
In certain niches, it is quite normal for pages to load in 5-6 seconds. Thus, the well-known company OZON cannot boast of the speed of its online store, but this does not prevent it from having a high conversion rate.
It will be useful!
Refusal to resize imagesDon't resize images using CSS, width and height. It is better to make adjustments first using a graphic editor.
Instead of one scalable illustration, which takes up a lot of space and slows down loading, you should use several images adapted for different devices.
To ensure that the browser loads the correct option every time, install the Imager plugin (for WordPress). It works like this:
new Imager((availableWidths: ));
Special code simplification techniques reduce the size of elements by shortening function names and removing garbage. You can further improve CSS and JavaScript by changing variable names (if the HTML is updated and the selectors work correctly).
Simplifying the code is not difficult - there are many services: JSCompress or Refresh-SF. Google PageSpeed Insights is also suitable for this. After performing page analysis on it, click on “Shorten HTML” and then on “View Contents”.
Pay attention! It's best to place JS files at the end of the page and CSS at the beginning. This way, your resource will make a positive impression on users both in appearance and in speed.
Optimizing web fontsConnected web fonts are the design standard for modern websites. But, unfortunately, they negatively affect the performance of the site. The problem is aggravated when pointing to font files in CSS and using public services that require additional connections.
Start using the new formats WOFF and WOFF2, while eliminating all character sets except Cyrillic and Latin.
The situation can be improved using the link rel=“preload” specification and the font-display CSS property. The first indicator instantly tells the browser to download the font file, the second allows you to control the behavior of the browser in case of a delay.
Using a cache means that site files will be downloaded from the server only once. Subsequently, they are saved to the computer and “pulled up” when loaded from the user’s PC.
To connect the browser cache, you need to create a .htaccess file and, using the expires module, enter the selected directives in it:
- Expires - is responsible for the relevance of the cache (you can set the period from a week to a year).
- Cache-Control: max-age - an analogue of the previous header that performs the same functions.
- Last-Modified and ETag - set a unique id for each url in the cache. In Nginx they are enabled by default for static files.
- WordPress
To optimize CSS and JavaScript in this case, it is worth installing the Autoptimize plugin. You can also load adjusted page elements from the PageSpeed Tool.
Please note that the basis for the “ease” of the resource is the correctly chosen topic. If the current version is slowing down your project, it makes sense to change it.
- Opencart
You should reduce the size of static content - Google ModPagespeed is suitable for Nix systems. You can also use Gzip, an image compression tool.
- Joomla
Optimize illustrations for the Web, then they will have less weight. Never download pictures from high resolution for their subsequent reduction via CSS and HTML. A large number of “unfavorable” elements will lead to a serious slowdown of the site.
- 1C Bitrix
In the administrative panel of this CMS there are many useful settings. For example, “Autocache” and “CSS Optimization”, where you can choose the functions that suit you: merging files, creating compressed copies, etc.
ConclusionNow you know how important resource performance is for its conversion, indexing and ranking. We hope this article answered all your questions and helped you optimize your website with minimal effort!
I think it’s no secret that page loading speed is influenced by many factors. If anyone doesn’t know, I’ll briefly say the following: loading speed affects not only whether the visitor will wait for your site to load, but also SEO optimization. Indeed, today many search engines have begun to take into account page loading speed when ranking sites. Therefore, the faster your site loads, the more visitors you can get from search engines, and, consequently, the more money you can earn from it.
Therefore, in this article I decided to collect the top 10 tips on how you can increase the loading speed of a web page and the site as a whole. The article does not pretend to be genius and is intended for beginners.
So, here we go:
1. Reduce the number of HTTP requests
80% of page loading is focused on loading page components: scripts, photos, CSS files, flash. The HTTP/1.1 specification recommends that browsers should download no more than 2 components of a web page from a single host in parallel. By reducing the number of these components, we reduce the number of HTTP requests to the server and, as a result, increase the page loading speed.
But how to reduce the number of requests to the server without affecting appearance pages?
2. Place CSS files at the top of the page
By placing a connection to css files in the page header, we get gradual rendering of the page, i.e. the page will load gradually - first the header, then the logo at the top, navigation, etc. – and this in turn serves as an excellent indicator of page loading for the user and improves the overall impression of the site.
Placing CSS files at the bottom of the page prevents many browsers from rendering the page incrementally. This is explained by the fact that the browser “does not want” to redraw elements whose style may change after loading the page. So always include all your CSS files at the top of the page in the HEAD section.
3. Place javascript at the bottom of the page
By placing javascript files at the bottom of the page, we allow the browser to load the page with the content first, and only then start loading the javascript files. If your site keeps up with the times and contains all possible interactive bells and whistles, then there can be several of these javascript files and they can weigh several hundred kilobytes, so forcing the user to wait until all your javascript files are loaded before loading the page is disastrous.
In addition, external .js files block parallel loading. The HTTP/1.1 specification recommends that browsers should download no more than 2 components of a web page from a single host at a time. Thus, if the images for your site are located on different hosts, you will receive more than 2 parallel downloads. And when the script is downloaded, the browser will not start any other downloads, even from other hosts.
4. Minify css and javascript
File minimization is the removal of all non-essential characters from the code in order to reduce the size of the file and speed up its loading. In the minimized file, all comments and insignificant spaces, line breaks, and tab characters are removed. Everything is simple here. The smaller the file size, the less time it will take the browser to download it. And these 24 online services for compressing and optimizing CSS code will help you minimize your code.
5. Use subdomains for parallel downloads
As I said above, according to the HTTP/1.1 specification, browsers are subject to restrictions on the number of simultaneously downloaded website components, namely no more than 2 components from one host. Therefore, if your site has a lot of graphics, then it is better to place it on a separate subdomain or subdomains. For you it will be the same server, but for the browser it will be different. The more subdomains you create, the more files the browser will be able to load at the same time and the faster the entire site page will load. All you have to do is change the address of the pictures to a new one. A very simple but effective way.
6. Use your browser cache
Caching is becoming extremely important for modern websites that rely heavily on JavaScript and CSS. The fact is that when a visitor visits your site for the first time, the browser will download all the javascript and css files, and will also load all the graphics and flash, but by correctly setting the Expires HTTP header, you will make the page components cacheable. This way, when a visitor visits your site again or moves to the next page of your site, his browser cache will already contain some necessary files and the browser won't need to download them again. Hence the gain in site loading speed.
Therefore, set the Expires HTTP header wherever possible, several days or even months in advance. In order for the Apache web server to issue HTTP Expires headers that comply with the recommendations, you need to add the following lines to the .htaccess file located in the root folder of the site:
Header append Cache-Control "public" FileETag MTime Size ExpiresActive On ExpiresDefault "access plus 0 minutes" ExpiresByType image/ico "access plus 1 years" ExpiresByType text/css "access plus 1 years" ExpiresByType text/javascript "access plus 1 years" ExpiresByType image/gif "access plus 1 years" ExpiresByType image/jpg "access plus 1 years" ExpiresByType image/jpeg "access plus 1 years" ExpiresByType image/bmp "access plus 1 years" ExpiresByType image/png "access plus 1 years"
This fragment of the Apache Web server configuration file checks for the presence of the mod_expires module and, if the mod_expires module is available, turns on the sending of Expires HTTP headers, which set the retention period for the above objects in the cache of browsers and proxy servers to one year from the moment of first loading. By setting the browser cache's lifetime to this level, it may be difficult to update files. Therefore, if you have changed the contents of a css or javascript file and want these changes to be updated in the browser cache, then you need to change the name of the file itself. Usually the version of the file is added to the file name, for example: styles.v1.css
7. Use a CDN to load popular JavaScript libraries
If your site uses a popular javascript framework, such as jQuery, then it is better to use a CDN to connect it.
8. Optimize your images
You need to determine the appropriate format for your images. Selecting the wrong image format can significantly increase the file size.
- GIFs are ideal for images with multiple colors, such as a logo.
- JPEG – great for detailed images with a large number flowers such as photographs.
- PNG is your choice when you need a high-quality image with transparency.
Here are a few online services to optimize images:
9. Don't scale images
Do not resize the image using the width and height attributes of the tag, or when CSS help. This also negatively affects page loading speed. If you have an image with a size of 500x500px, and you want to insert an image with a size of 100x100px onto the site, then it is better to resize the original image using graphic editor Photoshop, or any other. The lighter the image, the less time it will take to load it.
10. Use Gzip compression
As studies have shown, gzip compression text file“on the fly” in 95–98% of cases allows you to reduce the time it takes to transfer a file to the browser. If you store archived copies of files on the server (in the memory of the proxy server or just on disk), then in general the connection can be released 3-4 times faster.
Beginning with HTTP/1.1, web clients indicate which compression types they support by setting the Accept-Encoding header in the HTTP request.
Accept-Encoding: gzip, deflate
If the web server sees such a header in a request, it can apply response compression using one of the methods listed by the client. When issuing a response, the server notifies the client via the Content-Encoding header about how the response was compressed.
Content-Encoding: gzip
The data transferred in this way is approximately 5 times smaller than the original data, and this significantly speeds up their delivery. However, there is one drawback: it increases the load on the web server. But the issue with the server can always be resolved. So let's not pay attention to this.
In order to enable GZIP compression on your website, you need to write the following lines of code in the .htaccess file:
AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/css BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0 no-gzip BrowserMatch \bMSIE !no -gzip !gzip-only-text/html
If this method If it worked, then great, if not, then you can try this code:
AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml application/xhtml+xml text/javascript text/css application/x-javascript BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4.0 no-gzip BrowserMatch bMSIE !no-gzip !gzip-only-text/html mod_gzip_on Yes mod_gzip_item_include file \.js$ mod_gzip_item_include file \.css$
But again, this code does not work on all servers, so it is better to contact the support service of your hosting provider and clarify this issue.
Well, that’s actually all I wanted to tell you. In this article, I tried to list all the main methods of client optimization to increase the loading speed of a web page. In addition to client optimization, there is also server optimization. But this is a topic for a separate article.
If you missed something or have something to add, write your opinion in the comments below to this post. Thank you for your attention!
Hello guys!
Today will be one of the most important topics in internal website optimization. The material is large, but practical and useful. I supported the difficult moments with video lessons.
We'll talk about how to speed up the loading of your website, using 7 working methods. Perhaps they are known to everyone. But I noticed that not everyone uses them. And in the complex, especially few people.
In general, in the content I will describe all the methods point by point, and then read and put everything into practice.
Before speeding up the site, I want to say a few words about the importance of this action and about ways to check loading speed.
It has long been known that resource loading speed is one of the ranking factors in search results. If you take absolutely 2 identical pages, but one loads faster, then it will have higher positions in the search results. But this does not mean that the first will be in position 30, and the second in position 1. No, it's just that a faster loading site will rank slightly better.
Therefore, if there are any easy ways to overtake our competitors in at least something, then we need to do it. Moreover, there are a lot of such methods. Using all of them, we will go in the right direction and overtake our competitors.
Regarding checking the site loading speed, I have always used the webwait service. Once you go to it, you just need to insert the address of any page on your site and start checking.
By default, the service will check the page loading speed 5 times to determine the average value. The interval between requests will be 5 seconds. If you want to change both values, then I have highlighted the corresponding settings with a blue box in the image above. The first is the number of checks, the second is the interval between requests.
I just checked the loading speed of one of my articles. Based on the results of 5 checks, I received an average result of 0.82 seconds.
Of course, it can be difficult to achieve a small value and this depends on many factors:
- Amount of content on the page;
- Number of loaded scripts;
- Size of graphics on the page and on the site as a whole;
- Number of plugins.
Therefore, you need to try to reduce the influence of all these factors. This is what we begin to talk about next. Let's move on to the first and perhaps the simplest method.
Graphics optimizationIt's no secret that the most significant element of each site is graphics. This includes both graphics on each page and overall graphics. Regarding the graphics on each page, these are content graphics - images, screenshots, photographs. General graphics are graphics that are included in the website design. We can optimize all this.
You should never include full-size graphics in your articles. This error is clearly expressed on sites dedicated to culinary topics and photographs, when all photographs are loaded into articles in full size.
One photo taken with an average quality SLR camera will weigh several megabytes. If you upload such a photo to the site, the visitor will download the entire photo when entering the page. Imagine how long it would take for a page to load if you posted 10 high-volume images.
Pay attention to this point when publishing content. I once wrote an article about without loss of quality. The material will be very useful to you.
Regarding design, try to use fewer images. You can make a completely sane and organic design using CSS styles. This will be even better. If you look at very popular resources, you will notice that their design is essentially white background with dividing lines. This plays into your hands very much and kills 2 birds with one stone:
If you can’t live without colorful images, then an article about reducing the size of pictures (link above) can help.
CachingCaching is perhaps the most important element in quickly loading website pages. Especially this function useful for high traffic when many queries are created to the database.
To do caching on a website (for WordPress), you need to install the Hyper Cache plugin. Full instructions read on. I chewed everything there.
You can also add some codes to the .htaccess file that will also enable caching as well as gzip compression. To be honest, I didn’t notice their effect on my site. Maybe because my blog was already fully optimized. And I don’t see much point in them. And there is one problem, since we won’t be able to clear the cache. Then no changes will be visible on the site. Therefore, I will not give these codes so that you don’t rack your brains later if problems arise.
I don't use them. Caching using the Hyper Cache plugin is more than enough.
Script loading optimizationIf your site is quite functional (various social buttons, sliders, traffic counters, etc.), then it has a lot of scripts.
Scripts are always an extra and heavy load on the site. Always get rid of them if possible. If this is not possible, then you can load them last, and also remove them from the theme template code itself.
To load scripts at the very end of page loading, they need to be placed at the very bottom of the page code, that is, in the footer. In WordPress, this is done by placing it in the footer.php file before the closing tag.
You can also place scripts in separate file, not in the footer.php file. And then load this file at the end of the basement file. This is the best way to load scripts on the site.
I'll show you in practice how to do it all. I'll start with a video tutorial.
Typically, most scripts are placed in the header.php file between the tags and they are placed between the . As an example, I show one script from my header file.
I have highlighted with a red frame the part that we need. As you can see, it is enclosed in the opening and closing tags of the script, which are highlighted in blue frames. I highlighted the closing tag with a black frame to show where the script itself is located.
To place this script in a separate file, we need to take its contents (red box) and place it in a new file, which I create using the Notepad editor. The contents of the new file will look like this.
Now let's save this file in .js format and call it a convenient name. I'll call it "footer-scripts.js" to clearly understand that this is a file of scripts that are displayed in the footer of the site.
Now you can upload this file to the site so that the scripts work. To do this, you need to place a line of code that specifies the path to this file. You need to place the code in the footer.php file before the closing tag /
Here is my line of code.
|
In it you will need to replace the path to the file and its name, if it was called differently. To make it easier to understand, I am providing a line with hints.
The file path in this line is suitable for WordPress sites. If you have a website on a different engine or just an HTML page, then the path will have to be changed to suit you.
When we change a line, we place it in the footer file before the closing body tag. It will look like the image below.
It should be about the same for you. As you can see, in addition to this line, other scripts are also displayed. Thus, they are loaded last when the site loads. The site code itself becomes cleaner and more pleasant for search engines. This also plays a role in promotion.
In this way, you should get rid of the maximum number of scripts in your template files and try to either remove them altogether or load them through a file, as I showed above. This is one of the best ways, how to speed up a site if it has a lot of scripts.
If you need to place not one script, but several, in one file, then simply indent it down and place the new code. But then it’s better to sign each script so as not to get confused later. For example, you can download my file to refer to it.
And one more note. Not all scripts work in the site footer. Some only work when placed in the header, that is, in the Header.php file between tags. For example, social button“I like” from VKontakte does not work in the basement if you take its code from social network. In this case, you will need to place the script in the header.
Getting rid of unnecessary requests in the template codeThis is the most difficult way to speed up a site that runs on some kind of engine, for example WordPress. Its essence is to replace lines php code in the template file to the already generated code to get rid of unnecessary generation of queries to the database.
We will need the header.php file and everything that is inside it between the tags. PHP codes that generate requests and display basic information are stored between these tags. The whole point will be easier to understand with the help of the video tutorial that I have prepared below.
Now the text version.
I will show everything using the example of a line that generates a request to display the site encoding. The line in the file looks like this.
As you can see, this is PHP code. If we look at the source code (ctrl+u) of any page on the site, we will see that this PHP code no longer exists, but there will be HTML code with the specified encoding.
To get rid of this request to generate the encoding, you need to take a ready-made line from the source code and change the php code in the template file with it. Ultimately it will be like this.
We got rid of one request. In the same way, you need to replace other possible lines. Of course, it will not be possible to do everything, since not everything is in source code is displayed. But you need to strive for the maximum number of replacements.
I would also like to draw your attention to the fact that there is a code for generating the site name. It is usually contained in tags. If you plan to change the name of the resource, then either do not replace this code or do not forget to change the name in the file code later, since after replacing the name will be output from the finished line with the name. The site name will not be generated, since there will be no PHP code. Please take this into account.
Also, do not forget to carry out all such manipulations with files only after . And do them on your computer using editing programs so you can undo the edits. I use Notepad for similar purposes.
Disabling revisionsI'll torture you again with a video tutorial.
Revisions are automatic saving copies of records that are made when records are created at certain time intervals.
In fact, this is a useful thing, but sometimes it creates a lot of garbage and loads the database. I would not strongly recommend disabling this functionality, as sometimes it helps. The light may suddenly go out, and then what? And, if there are copies of the recording, then you can safely restore your progress. This has happened more than once, I know from my own experience.
I turned them off anyway, but if you are a beginner, I don’t recommend doing this. Better time Clear the database of revisions from time to time, since a large number of them creates a significant load.
In the root of the engine there is a WP-includes folder, which contains the default-constants.php file. You need to open it and find the following content in it.
if (!defined("AUTOSAVE_INTERVAL")) define("AUTOSAVE_INTERVAL", 60); /** * @since 2.9.0 */ if (!defined("EMPTY_TRASH_DAYS")) define("EMPTY_TRASH_DAYS", 30); if (!defined("WP_POST_REVISIONS")) define("WP_POST_REVISIONS", true);
define ("AUTOSAVE_INTERVAL" , 60 ) ; * @since 2.9.0 define ("EMPTY_TRASH_DAYS" , 30 ) ; if (! defined ("WP_POST_REVISIONS" ) ) define ("WP_POST_REVISIONS" , true ) ; |
At the time of writing this article, all this is found starting from line 277. All this code is responsible for the safety of our records. It consists of 3 parts, each of which begins with if.
The first part is responsible for the interval for automatically creating revisions. The default value is 60 seconds, which means one copy of the recording will be created every minute. Imagine that you spend more than one hour writing an article. Can given value increase, for example to 10-20 minutes. This setting works only when revisions are enabled.
if (!defined("AUTOSAVE_INTERVAL")) define("AUTOSAVE_INTERVAL", 600);
if (! defined ("AUTOSAVE_INTERVAL" ) ) define ("AUTOSAVE_INTERVAL" , 600 ) ; |
The value is set in seconds.
The second part is responsible for the storage time of deleted entries in the recycle bin. When we delete entries, they go to the trash. By default, they are stored there for 30 days, after which they are deleted. If you set the value to 0, then entries will not go into the trash, but will be immediately deleted without the possibility of recovery.
if (!defined("EMPTY_TRASH_DAYS")) define("EMPTY_TRASH_DAYS", 0);
if (! defined ("EMPTY_TRASH_DAYS" ) ) define ("EMPTY_TRASH_DAYS" , 0 ) ; |
The third part is responsible for the work of audits. They are enabled by default. If you want to turn it off, then true must be changed to false or set to 0.