Skip to content

Instantly share code, notes, and snippets.

@matthewp

matthewp/hack-illinois-submission.md

Forked from justinbmeyer/hack-illinois-submission.md
Created February 26, 2017 16:23
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save matthewp/57307bb4e5bf0fe1aab27d754f20578e to your computer and use it in GitHub Desktop.
Save matthewp/57307bb4e5bf0fe1aab27d754f20578e to your computer and use it in GitHub Desktop.
Download ZIP
HackIllinois Team Submission - Streamable Apps
Raw
hack-illinois-submission.md

As a team of 6, we created and improved tools that make it easy to build streaming isomorphic web applications. When complete, these tools will have a significant impact web performance. As far as their mentors (Justin and Matthew) know, this will be the first isomorphic web framework that supports streaming.

Terms:

  • isomorphic web applications - Also known as universal web application, isomorphic web applications mean that the same web application and run both client-side and server side. These applications provide server-side rendering (SSR) of a web application, for quick initial performance, and then load the web application into the browser for fast subsequent performance.

  • server-side rendering (SSR) - Server side rendering means taking a JavaScript web app that can run in the browser, loading it in a server environement (typically NodeJS), and using it to produce an initial HTML response. This results in faster performance because the user can immediately see the content.

    Where a traditional web app experience has multiple steps before a user sees meaningful content:

    cursor_and_v5_key

    A server side rendered application user sees their content immediately:

    cursor_and_v5_key

  • streaming - A streaming application is able to make use of partial data or content as it gets it. Browsers are able to process an HTML response stream. For example, if the following HTML is sent to the browser, it is able to download style.css while it waits on the remaining content:

    <html>
  <head>
    <link rel="stylesheet" type="text/css" href="style.css">
  </head>
  <body>
    <h1>Start of Content</h1>
    <ul>
      <!--- PENDING CONTENT -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment