Correction of problems with JavaScript related to Google search

This guide will help you determine and fix the problems with JavaScript, which can block your page or certain contents on the pages working with JavaScript from display in searching for Google. Despite the fact that Google Search can process JavaScript, there are some differences and restrictions that it is important to consider when developing your pages and applications to take into account how Google robots gain access and display your content. Our guide on the basics of JavaScript SEO offers more information on how to optimize your site with JavaScript for Google Search.

Understanding Googlebot's work and its interaction with your site in Google

Googlebot is designed to be a bona fide network user. The main task is to scan, while Googlebot should avoid worsening user experience on the site. Googlebot and its WEB RENDERING SERVICE (WRS) component are constantly analyzing and identify resources that do not affect the main content of the page and may not be loaded. For example, reporting and errors that are not important for the main content are not subject to loading. Use a report on scanning statistics in Search Console to monitor the activity of Googlebot and WRS on your Google website.

Checking and correcting JavaScript errors on your site affecting Google search

If you suspect that JavaScript problems can block your page or specific contents on the pages with JavaScript from display in searching for Google, follow these steps. If you are not sure that it is JavaScript that is the main reason, follow our general debugging manual to determine a specific problem.

To test how Google scans and displays the URL, use the Rich Results Test tool or the URL testing tool in Search Console. You can see the loaded resources, the output of the JavaScript console and the exceptions, the detached DOM and many other useful information.
Additionally, it is recommended to collect and check JavaScript errors that users face, including Googlebot, on your site to identify possible problems affecting content rendering. An example of a code for logging JavaScript errors can be used in a global Onerror:

window.addEventListener('error', function(e) {
 var errorText = [e.message, 'URL: ' + e.filename, 'Line: ' + e.lineno + ', Column: ' + e.colno, 'Stack: ' + (e.error && e.error.stack || '(no stack trace)')].join('
');
 var DOM_ID = 'rendering-debug-pre';
 if (!document.getElementById(DOM_ID)) {
 var log = document.createElement('pre');
 log.id = DOM_ID;
 log.style.whiteSpace = 'pre-wrap';
 log.textContent = errorText;
 if (!document.body) document.body = document.createElement('body');
 document.body.insertBefore(log, document.body.firstChild);
 } else {
 document.getElementById(DOM_ID).textContent += '

' + errorText;
 }
});

Prevention of errors 404 and their impact on your site in Google

Particular attention should be paid to preventing errors like "Soft 404", especially if your site uses a single -page application (SPA). In order for errors to be not indexed by search engines, use the following strategies:

Redirement to a page with a state code 404, if content does not exist:

 fetch(`https://api.example.com/page/${id}`).then(res => res.json()).then((page) => {
 if (!page.exists) {
 window.location.href = '/not-found';
 }
 });

Using a meta-tag Robots with a Noindex parameter:

 fetch(`https://api.example.com/page/${id}`).then(res => res.json()).then((page) => {
 if (!page.exists) {
 const metaRobots = document.createElement('meta');
 metaRobots.name = 'robots';
 metaRobots.content = 'noindex';
 document.head.appendChild(metaRobots);
 }
 });

If your SPA application uses a client JavaScript to process errors, often a problem arises when erroneous pages meet the status of 200 instead of the desired error code.

Using user permits and their impact on your Google website

Googlebot will not be able to provide permission to access functions such as using a camera or other user resolutions. If your page requires the provision of such permits to access the content, provide the user with an alternative way to view without the need to provide permits.

Using URL fragments in your site and their influence on search visibility in Google

The previously used approach with URL fragments (for example, https://example.com/#/products) is no longer supported for scanning Googlebot, since since 2015 the Ajax-Crawling scheme has been stopped. Instead of URL fragments, it is recommended to use History API for dynamic content loading in SPA.

Recommendations for caching and using your data on the site to improve indexing in Google

To avoid caching problems, use the content print. This will avoid the use of outdated JavaScript or CSS resources, and Googlebot will always receive relevant files. An example is the use of content version files in the title of files as Main.2BB85551.js. Details on the strategy of long -term caching read on Web.dev.

Checking the performance of your site in Google using web components

Use the Rich Results Test tool or the URL testing tool to check that your web components are correctly rendered. It is important to remember that WRS may not support some mechanisms for working with DOM, for example, a mechanism For light and shadow DOM. If the components of your site do not use it, contact the documentation to eliminate possible problems.

Page testing after corrections on your site for display in the search for Google

After you correct the indicated problems, test the page using the Rich Results Test or the URL testing tool in the Google Search Console again. If the problem is solved, you will see a green checkmark, and errors will not be displayed. If errors remain, seek help from the Search Central community.

For additional questions and consultations, you can contact the Seo.computer SEO company by mail info@seo.computer or through WhatsApp: +79202044461.

ID 115