2015년 3월 7일 토요일

Basic Web application model with node.js

 

As a ‘web’ novice, understanding the application model and typical architectures is very difficult since there are too many references, languages, jargons and opinions. ‘Loy Fielding’s great article is so far away from this chaotic situation.(Loy fielding’s article is still great from software architect’s perspective). Even if I am still a web novice, bravely I am trying to explain the current web application model.

Traditional Web application model

Traditional Web application model is a client-server model. The model is as simple as we can very easily understand the roles. The client is so thin, because the role is ‘rendering’ html pages provided by the server.

20150308_135405 

The traditional model’s drawbacks are follows:

- Expensive. In aspect of business, server is an entity we have to spend money, whereas client is ‘free’. This model doesn’t take advantage of the free and very powerful entity.

- Difficult to support various kinds of clients. Sometimes, we need to consider supporting web browsers, traditinal web apps, interactive (one-page) web apps, and native apps. Some types of clients need to have its own UI/UX instead of html pages provided by the servers.

- Complicated from developer’s perspective despite the simplicity of this models. Everything the developer must implement is in the server. As you know, well- decoupled functions may improve productivity.

3-Box model

Let clients be in charge of presentation. That makes severs simpler. In addition, split the role of servers into providing data and providing ‘static’ resources such as files, HTML, and style sheets. The concept is as following picture.

 20150308_135413

3-Box Model with client-templates

File server and content delivery network(CDN) focus on providing static resources such as style sheets, scripts, HTML files, and other static files(image, video, and so on).  ‘bootstrapper’ is one of javascript files and does all the work gathering everything and putting the web page together. To do that, it has ‘template engine’  to download all the proper resources including HTML templates and JSON APIs, get JSON data, and then eventually put them together in web pages. The bootstrapper runs on the client for presentation of data.

Typical prodecures of 3-box model with client-templates are as follows:

  1. The client downloads a skeleton HTML page pointing to Javascripts including ‘bootstrapper’, CSS files, and empty body element from node.js server.
  2. The bootstrapper downloads necessary templates, and call JSON API to get data.
  3. The bootstrapper applies the returned data to the templates.
  4. The final HTML code fills the empty web page.
  5. Eventually the web page is rendered.

20150308_135433

Practical 3-box model

Usually to run web services, proxy web servers are necessary for operational purposes such as monitoring, caching, load balancing and protecting from hacking. In addition to the operational purposes, the web servers could be used as file servers since the performance to handle static files are better than node.js.

Ryan Dahl : "You just may be hacked when some yet-unknown buffer overflow is discovered. Not that that couldn't happen behind nginx, but somehow having a proxy in front makes me happy".

Therefore, the following model is practical in my opinion (keep in mind, there are many web application models to meet various businesses and requirements)

20150308_135448

<Reference>

- Learning node.js

- http://stackoverflow.com/questions/5534399/is-it-reasonable-to-put-nginx-in-front-of-nodejs-to-serve-static-assets

댓글 없음: