Are there "problems" using jQuery’s small?

Question

For example, some parts of a site, I can not fully touch the HTML, put the platform blocks for "security" and does not let modify, so I use jQuery/Javascript to make the modification I need. Does this interfere with the performance of the site? Much or little?

Example of a code I used now, just to insert an image:

$j('<img src="http://i.imgur.com/UgaMSoE.png" style="max-width: 1.5rem;"/>').insertBefore('section#desejos .mywish__header a svg');

I use codes like this from time to time (not many, only once in a while), when you can’t modify something I need. This influences the website’s performance A LOT?

Do you have any problem using "small" codes in jQuery/Javascript?

Answer 1

Yes, there are SEO problems. Today charge time counts for the page to be well ranked in search engine.

This alone should be something to think about using jQuery. Even more to make a single line to do something that can be done the same or simpler without jQuery.

Much does not interfere with overall performance, but interferes.

The only way to know if it counts for your case is to do and test.

Answer 2

Can use without fear. This will not influence the performance, there is only an initial overload on the first load, where the file Javascript of jQuery that will be loaded. After this, the file will already be cached and there will be almost 0 cost of download.

Just make sure to use minified files in production, thus reducing the bandwidth required for download of these archives.

In cases where it will only make a small change via jQuery, try to use Javascript pure instead of carrying the jQuery just to insert a piece of content into the page for example.

Below an insert code of HTML on the page with pure javascript:

var newItem = document.createElement("LI");       // Create a <li> node
var textnode = document.createTextNode("Water");  // Create a text node
newItem.appendChild(textnode);                    // Append the text to <li>

var list = document.getElementById("myList");    // Get the <ul> element to insert a new node
list.insertBefore(newItem, list.childNodes[0]);  // Insert <li> before the first child of <ul>

This example was taken from W3schools website:

** Edited **

In the matter of SEO, you must put files Javascript at the bottom of the page to prevent file loading from blocking the page, thus generating delay in loading the site. You can even ask Google for an analysis to check the site and have some instructions to improve it. Clicking here you go to the analysis site of Google.