0

How to display a webpage without reloading the entire DOM with a progress bar like youtube?

I tried Angular 4 and I likeview a page. If the visitor navigate through the site, that is it, the downside I see is the fact that the whole js and css need to be loaded to the client with a simple "Loading" simply to fine, but if the visitor only consult a single page, this add a lot of bandwidth on both ends and wait/load time for the visitor.

In a perfect world, I would like a loading bar like youtube when the user switch page, and simply reload what changed (or it looked like it only reloaded what changed), for a smooth experience.

I started a little project with Hapi, Nunjucks and Polymer, and another one with Angular for comparison.

Does that even have a term? Since I don't really know the term, I feel like I don't even know what I'm talking about since I cannot research it, so I'm sorry in advance for my lack of knowledge.

Things I want / I'm looking for:

  • Can use Hapi as backend (I'm used to it - or Koa)
  • Independant ORM (I'm using RethinkDB, not a popular database choice)
  • Reusable components
  • Don't have to pack/load the whole JS (not like Angular)
  • Have a way to show/monitor progress of loading
  • Can be used with MDBootstrap (the most advanced material design bootstrap I've found)

EDIT: I noticed GitHub does the same thing.

Jeremy Dicaire
  • 4,615
  • 8
  • 38
  • 62
  • 1
    I think this should help :- https://stackoverflow.com/questions/18799579/reload-a-div-without-reloading-the-whole-page – Krysan Sep 29 '17 at 05:08
  • Thanks for that! Could I do that while monitoring the progress of the loading and change the address bar url? – Jeremy Dicaire Sep 29 '17 at 05:18
  • 1
    It really sounds like you're looking for React.js. Is this question open to the idea of using a completely different frontend framework? – Andrew Sep 29 '17 at 08:04
  • React? Argh then another framework to learn :P I would've prefer to stick to thing I know since I just started Angular 4 but I'll look into React - never really read about it (kind of forgot about it too) – Jeremy Dicaire Sep 29 '17 at 19:16

0 Answers0