title: Async programing in Javascript - Promise.all() do not work as expected
body: <p>I'm stuck in <em>Async programming in Javascript</em>.
  I know that <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all" rel="nofollow noreferrer">Promise.all()</a> will run parallel.</p>
  <p>Could you pls tell me what I'm wrong with this code below?</p>
  <p>It should take <code>100ms</code>. But actually, it takes <code>200ms</code> :(</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>// 1. Define function here
  var getFruit = async (name) =&gt; {
    const fruits = {
      pineapple: ":pineapple:",
      peach: ":peach:",
      strawberry: ":strawberry:"
    };
    await fetch('https://jsonplaceholder.typicode.com/photos'); // abount 100ms 
    return fruits[name];
  };
  
  var makeSmoothie = async () =&gt; {
    const a = getFruit('pineapple');
    const b = getFruit('strawberry');
    const smoothie = await Promise.all([a, b]);
    return smoothie;
    //return [a, b];
  };
    
  /// 2. Execute code here
  var tick = Date.now();
  var log = (v) =&gt; console.log(`${v} \n Elapsed: ${Date.now() - tick}`);
  makeSmoothie().then(log);</code></pre>
  </div>
  </div>
  </p>