what is the impact of adding sync and async tags to a web page performace

[manoj_node]

Hi ALL,

We ae using DTM to add Tags on pages and want to know how adding more and more tags would affect page's performance? Adding more and more tags would really slow down page load ( if tags are added on load) or will it be same in all cases - page loading with 2 tags is same as page loading with 1000 tags.

please help me with your points.

[kautuk_sahni · Accepted solution]

Hi

Please have a look at following links for your reference :-

Link:- http://stackoverflow.com/questions/748175/asynchronous-vs-synchronous-execution-what-does-it-really-...

// Asynchronous vs synchronous execution

Synchronous (one thread):

1 thread ->   |----A-----||-----B-----------||-------C------|

Synchronous (multi-threaded):

thread A -> |----A-----| \ thread B ------------>   ->|-----B-----------| \ thread C ---------------------------------->   ->|-------C------|

Asynchronous (one thread):

         A-Start ---------------------------------------- A-End | B-Start ----------------------------------------|--- B-End |   |     C-Start -------------------- C-End      |     | V   V       V                           V         V     V 1 thread-> |-A-|---B---|-C-|-A-|-C-|--A--|-B-|--C--|---A-----|--B--|

Asynchronous (multi-Threaded):

 thread A ->     |----A-----| thread B ----->     |-----B-----------| thread C --------->     |-------C----------|

As an aside, I should mention that technically, the concept of synchronous vs. asynchronous really does not have anything to do with threads. Although, in general, it would be unusual to find asynchronous tasks running on the same thread, it is possible, (see below for e.g.) and it is common to find two or more tasks executing synchronously on separate threads... No, the concept of synchronous/asynchronous has to do solely with whether or not a second or subsequent task can be initiated before the other task has completed, or whether it must wait. That is all. What thread (or threads), or processes, or CPUs, or indeed, what hardware, the task[s] are executed on is not relevant. Indeed, to make this point I have edited the graphics to show this.

ASYNCHRONOUS EXAMPLE. In solving many engineering problems, the software is designed to split up the overall problem into multiple individual tasks, and then execute them asynchronously. Inverting a matrix, or a finite element analysis problem, are good examples. In computing, sorting a list is an example. The quick sort routine, for example, splits the list into two lists, and sorts each of them by calling itself recursively. In both of the above examples, the two tasks can (and often were) executed asynchronously. They do not need to be on separate threads. Even a machine with one CPU, and only one thread of execution can be coded to initiate processing of a second task before a first one has completed. The only criterion is that the results of one task are not necessary as inputs to the other task. As long as the start and end times of the tasks overlap, (possible only if the output of neither is needed as inputs to the other), they are being executed asynchronously, no matter how many threads are in use.

SYNCHRONOUS EXAMPLE. Any process consisting of multiple tasks where the tasks must be executed in sequence, but one must be executed on another machine (Fetch and/or update data, get a stock quote from a financial service, etc.). If it's on a separate machine it is on a separate thread, whether synchronous or asynchronous.

In simpler terms:

SYNCHRONOUS

You are in a queue to get a movie ticket. You cannot get one until everybody in front of you gets one, and the same applies to the people queued behind you.

ASYNCHRONOUS

You are in a restaurant with many other people. You order your food. Other people can also order their food, they don't have to wait for your food to be cooked and served to you before they can order. In the kitchen restaurant workers are continuously cooking, serving, and taking orders. People will get their food served as soon as it is cooked.

Drawback of Async:-

If you were just operating under the assumption that async = good, you might do something like:

     <script async src="/js/libs.js"></script>

    <script async src="/js/page.js"></script>

That could be bad news, because chances are "libs.js" has dependencies for "page.js", but now there is no guarantee the order in which they run (bad).

Link :- https://www.nccgroup.trust/uk/about-us/newsroom-and-events/blogs/2015/july/what-are-the-benefits-and...

// What are the benefits and drawbacks of loading JavaScript asynchronously?

I hope this will help you.

Thanks and Regards

Kautuk Sahni