100%Ajax网站

I have been looking at Hulu's new website and I am very impressed from a developer's standpoint (as well as a designer's).

I have found that, unless you switch between http/https, you are served content entirely from json requests. That is a HUGE feat to have this level of ajax while maintaining browse back button support as well as allowing each url to be visited directly.

I want to create a website like this as a learning experience. Is there any type of framework out there that can give me this kind of support?

I was thinking I could...

  • leverage jQuery
  • use clientside MVVM frameworks like KnockoutJS?
  • use ASP.NET MVC content negotiation to serve html or json determined by an accept header.
  • using the same codebase.
  • use the same template for client side and server side rendering
  • provide ways to update pagetitle/meta tags/etc.

Ajax forms/widgets/etc would still be used, by I am thinking about page level ajax using json and client side templates.

What do you think? Any frameworks out there? Any patterns I could follow?

It is always best to first build a website without AJAX support, then add AJAX on top of that. Doing this means that:

  • users without javascript can already access your website
  • users can already visit any URL directly.

Adding AJAX support can be accomplished by various javascript libraries. So that you can render json content, you will want to look at javascript templating. You will want to use javascript templating even on your server side for when you add AJAX support (file extension .ejs). This will probably require some appropriate libraries to run javascript on the server.

When you add AJAX support, you will want to use the "History.js" library for browser back/forward/history support.

Make no mistake. This is a HUGE project (unless your website only has a few pages). So it is going to take a LONG time to add all the AJAX support to the best possible standard.

to answer your bullet point about using the same template server side as well as client side: check outdust. It was originally developed by akdubya, but has since been adopted and enhanced by linkedin. They use it to render templates on their mobile app client side. Personally I've used it on the server side and it works great.