Why be optimistic about JavaScript?

JavaScript is a popular programming language that is widely used by developers. It can be run on various platforms, such as browsers, servers, and edge devices. Despite its quirks and flaws, JavaScript has gained widespread adoption due to its presence in most web browsers, its extensive collection of tools and libraries, and the growing popularity of TypeScript. As a result, developers can use their knowledge of APIs like Request and Response across different platforms.

JavaScript: In the Browser

if (/Trident\/7\./.test(navigator.userAgent)) {
  // The user's browser is Internet Explorer 11
}

/*
This code uses a regular expression to test the navigator.userAgent property, which contains a string representing the user's browser and version. The regular expression checks for the presence of the string "Trident/7." in the user agent, which is a unique identifier for Internet Explorer 11.

If the regular expression returns a match, it means that the user's browser is Internet Explorer 11. You can then execute any code that you want to run specifically for Internet Explorer 11.

Note: This code will only work for Internet Explorer 11. To detect other versions of Internet Explorer or other browsers, you will need to use different techniques.
*/

@supports not (aspect-ratio: 16/9) {
  .aspectRatio {
    overflow: hidden;
    padding-bottom: 56.25%;
    height: 0;
  }
}

<span> <-- needed to maintain aspect ratio
  <span> <-- needed to maintain aspect ratio, CSS padding hacks
    <img src="" style="" /> <-- inline styles to prevent layout shift
    <noscript>...</noscript> <-- JS needed for IntersectionObserver
  </span>
</span>

<img
  alt="A kitten"
  decoding="async"
  height="200"
  loading="lazy"
  src="https://placekitten.com/200/200"
  style="aspect-ratio: auto 1 / 1"
  width="200"
/>

JavaScript: On the Server

JavaScript: At the Edge

export const config = {
  runtime: 'edge'
}

// Web standard Request API
export default function handler(req: Request) {
  // Web standard URL API
  const { searchParams } = new URL(req.url)
  const name = searchParams.get('name')

  // Web standard Fetch API
  const req = await fetch('https://...', { body: { name } })
  const data = await req.json()

  // Web standard Response (.json is new)
  // https://github.com/whatwg/fetch/issues/1389
  return Response.json(data);
}