title: What do the gaps mean in the diagram given in page 181, chapter 11: Asynchronous programming in the book Eloquent Javascript?
body: <p>I was reading &quot;Eloquent Javascript&quot;, chapter 11 on asynchronous programming and there is a diagram given on page 181 contrasting the differences in single threaded, multithreaded and asynchronous techniques in the case of sending two network requests. Black dots represent the points where the request was made in the timeline. The thin lines represent the time spent waiting for the response. The thick lines represent normal program execution. My doubt was about the gaps in the timeline. The author doesn't mention what they represent so I'm having a hard time making a precise distinction in the concepts. Any help in understanding is appreciated.</p>
  <blockquote>
  <p>An asynchronous model allows multiple things to happen at the same time.
  When you start an action, your program continues to run. When the action
  finishes, the program is informed and gets access to the result (for example,
  the data read from disk).<br />
  We can compare synchronous and asynchronous programming using a small
  example: a program that fetches two resources from the network and then
  combines results.<br />
  In a synchronous environment, where the request function returns only after
  it has done its work, the easiest way to perform this task is to make the requests
  one after the other. This has the drawback that the second request will be
  started only when the first has finished. The total time taken will be at least
  the sum of the two response times.<br />
  The solution to this problem, in a synchronous system, is to start additional
  threads of control. A thread is another running program whose execution may
  be interleaved with other programs by the operating system—since most modern computers contain multiple processors, multiple threads may even run at
  the same time, on different processors. A second thread could start the second
  request, and then both threads wait for their results to come back, after which
  they resynchronize to combine their results.<br />
  In the following diagram, the thick lines represent time the program spends
  running normally, and the thin lines represent time spent waiting for the net-
  work. In the synchronous model, the time taken by the network is part of the
  timeline for a given thread of control. In the asynchronous model, starting a
  network action conceptually causes a split in the timeline. The program that
  initiated the action continues running, and the action happens alongside it,
  notifying the program when it is finished.</p>
  </blockquote>
  <p><a href="https://i.stack.imgur.com/NmQXz.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/NmQXz.png" alt="enter image description here" /></a></p>