What do you call a hybrid traditional / push expression?

I wonder if there is a name for this technique in its various incarnations ... And if there are any resources for people to implement it.

Let's say you have a page very similar to github. And with a browser that supports JavaScript, you download

http://www.github.com/username/project

UI and inner content load simultaneously, the pre-AJAX way
- or -
UI wrapper loads, inner content loads via AJAX    

      

And it loads the static skeleton and all modules via AJAX. Or it can load the entire page statically.

Then you click on some navigation elements and try to visit

http://www.github.com/username/project/first_dir

With previously loaded UI
  Inner content navigation causes full page refresh
    - or -
  Inner content navigation causes inner content reload via page refresh
  - or -
Completely new page with UI and inner content loads, same as first example

      

At this point, I know that this page can be "visited" using the push state, and the internal module updated with AJAX, keeping the overall site chrome static. But if for some reason JavaScript was not supported OR the page was loaded using a full refresh, the page would load completely statically (or partially via AJAX after loading the skeleton, as in the first URL).

What is this method called? It's like a unified model, pushing through the server MVC model and the client MVC model. I know it can be done with a lot of elbow grease, but I was wondering if anyone had already researched this technique and developed guidelines on how to keep the two models in sync with the architecture.

+3


source to share


3 answers


Well, I really don't know what this method is called, but I can tell how we usually implement similar behavior in our project (based on the MVC architecture).

The fact is that View Helpers (or Partials, we chose the first) are used to create different parts of the entire page. For example, a sidebar is built with one Helper object, a table that represents a collection of some elements with another, and so on. Each of these helpers can be called a mini-sort because they are responsible for presenting some data in some special way.



Each of these helpers is ready to be called either as stand-alone (then its result will be used in the AJAX processor to update some part of the page) or as part of a more complex process (in which case its result will be used in the layout template form).

0


source


Similar to raina77ow, I also don't know what it's called, but we implemented this a while back for a mobile app / web page (which should also work in older versions of Opera / IE). First we created a more or less clean HTML page, which then bind all tags and replace the functionality via javascript with an ajax call that fetched the entire page and "cut" (jQuery has native functionality for this) that was relevant (it doesn't give full benefit of AJAX pages, but prevents various assets from being reloaded). It also prevents any complex "sync issues" or APIs that need to be able to return HTML JSON and .



Also, if I take the MVC model and how we have implemented in some of our applications, you can look at it like this: HTML is a view (static), JS is a controller that requests AJAX data from the model server side. This makes much more sense than representing a separate MVC framework for the front and backend.

0


source


Airbnb's Spike Bremm calls it the Holy Grail.

http://nerds.airbnb.com/weve-launched-our-first-nodejs-app-to-product

0


source







All Articles