U E D R S I H C RSS
ID
Password
Join
약속은 가장 늦게 하는 사람이 가장 잘 지킨다. ―장 자크 루소



Contents

1 개요
2 Ajax의 정의
3 Ajax의 차이점
4 누가 Ajax를 사용하는가?
5 앞으로 나아가자!
6 Ajax Q&A

1 개요 #

현재 사용자 반응적인 디자인에 대한 무언가가 "매력적"이라고 불릴수 있다면 그건 웹어플리케이션을 만드는 걸 말하는 것 일겁니다. After all, when was the last time you heard someone rave about the interaction design of a product that wasn’t on the Web? (Okay, besides the iPod.) All the cool, innovative new projects are online.

Despite this, Web interaction designers can’t help but feel a little envious of our colleagues who create desktop software. Desktop applications have a richness and responsiveness that has seemed out of reach on the Web. The same simplicity that enabled the Web’s rapid proliferation also creates a gap between the experiences we can provide and the experiences users can get from a desktop application.

That gap is closing. [http]Google Suggest을 보도록 하죠. Watch the way the suggested terms update as you type, almost instantly. 이제 [http]Google Maps을 봅시다. 확대기능이 있지요. 커서로 맵을 잡아 어느정도 스크롤을 시킬수도 있습니다. 다시말하자면, 이러한 모든 처리는 거의 순간적으로 일어나며, 페이지가 다시 로딩되는 것을 기다리지 않습니다.

Google Suggest와 Google Maps은 Adaptive Path(원문 아티클 사이트의 개발자그룹)의 Ajax라 불리는 새로운 웹어플리케이션 제작방법에 대한 두가지 예제입니다. Ajax는 Asynchronous JavaScript + XML의 줄임말이며, 웹에서 구현가능한 것들에 대한 근본적인 발상전환을 보여줍니다.

2 Ajax의 정의 #

Ajax는 하나의 기술이 아닙니다. It’s really several technologies, each flourishing in its own right, coming together in powerful new ways. Ajax incorporates: 고전적인 웹어플리케이션은 다음과 같이 작동합니다 - 인터페이스상의 대부분의 사용자 동작은 웹서버로 HTTP 요청을 다시 보냅니다. 서버는 몇가지 처리(데이타 수신, 숫자 처리, 물려있는 여러 시스템과의 대화)를 한다음 클라이언트에게 HTML 페이지를 반환합니다. It’s a model adapted from the Web's original use as a hypertext medium, but as fans of [http]The Elements of User Experience know, what makes the Web good for hypertext doesn't necessarily make it good for software applications.

http://www.adaptivepath.com/images/publications/essays/ajax-fig1_small.png
그림 1: 전통적인 웹어플리케이션 모델(왼쪽)과 Ajax 모델(오른쪽)의 비교

This approach makes a lot of technical sense, but it doesn't make for a great user experience. 서버가 자신의 일을 하고 있을동안 사용자는 대체 무얼하고 있을까요? 맞습니다. 기다리는 거죠. 한 작업안에 매 단계 동안 사용자는 조금 더 기다리게 됩니다.

당연한 얘기지만, 어플리케이션으로서 웹을 디자인하려한다면 사용자가 기다리지 않는 것을 원할겁니다. Once an interface is loaded, why should the user interaction come to a halt every time the application needs something from the server? In fact, why should the user see the application go to the server at all?

3 Ajax의 차이점 #

Ajax 어플리케이션은 사용자와 서버사이에 Ajax 엔진이라는 중간단계를 놓음으로서 웹상에서의 시작-정지-시작-정지와 같은 반복요소를 제거합니다. 어플리케이션에 계층을 추가하는 것은 반응성을 줄이는 것처럼 보이지만, 사실 그 반대입니다.

세션 시작시점에서 웹페이지를 로딩하는 대신, 브라우져는 Ajax 엔진을 로딩합니다. (엔진은 Javascript로 작성되어져있으며, 일반적으로 숨겨진 프레임에 쑤셔놓습니다.)

이 엔진은 사용자가 보는 인터페이스를 랜더링하는 것과 사용자를 대신하여 서버와 통신하는 일을 할 책임을 지게 됩니다. Ajax 엔진은 어플리케이션에 대한 사용자 대화를 서버통신과는 별개로 비동기적으로 처리할 수 있습니다. 이렇게 함으로서 사용자는 서버가 무언가를 처리할동안 텅빈 브라우져 윈도우 또는 모래시계 커서에서 해방됩니다.

http://www.adaptivepath.com/images/publications/essays/ajax-fig2_small.png
그림 2: 전통적인 웹 어플리케이션의 동기적인 반응패턴(위)와 Ajax 어플리케이션의 비동기적 패턴(아래)와의 비교

Every user action that normally would generate an HTTP request takes the form of a JavaScript call to the Ajax engine instead. Any response to a user action that doesn’t require a trip back to the server — such as simple data validation, editing data in memory, and even some navigation — the engine handles on its own. If the engine needs something from the server in order to respond — if it’s submitting data for processing, loading additional interface code, or retrieving new data — the engine makes those requests asynchronously, usually using XML, without stalling a user's interaction with the application.

4 누가 Ajax를 사용하는가? #

구글은 Ajax 접근법을 개발하는대 엄청난 투자를 하고 있습니다. 지난 몇년간 구글에서 개발된 주요 제품들([http]Orkut, [http]Gmail, [http]Google Groups, [http]Google Suggest, [http]Google Maps)은 모두 Ajax 어플리케이션입니다. (이들 Ajax 구현들에 대한 보다 많은 내부 기술사항에 대한 내용은 다음의 개별 분석들을 읽어보시기 바랍니다 - [http]Gmail 분석, [http]Google Suggest 분석, [http]Google Maps 분석) 나머지는 다음과 같습니다 - [http]Flickr에서 사람들이 좋아하는 기능중 대부분은 Ajax에 의존하고 있으며, 아마존닷컴의 [http]a9.com 역시 유사한 기술들을 적용하고 있습니다.

이들 프로젝트들은 Ajax가 단순히 기술적인 주장뿐만 아니라, 실제 어플리케이션 개발에서도 꽤 실용적이라는 것을 보여주고 있습니다. 이는 연구실안에서만 동작하는 별개의 기술이 아닙니다. 게다가 Ajax 어플리케이션은 간단하고 단지 하나의 함수로 구성된 구글 Suggest에서 매우 복잡하고 세련된 구글 maps에 걸쳐, 어떤 규모에서도 구현이 가능합니다.

At Adaptive Path, we've been doing our own work with Ajax over the last several months, and we're realizing we've only scratched the surface of the rich interaction and responsiveness that Ajax applications can provide. Ajax is an important development for Web applications, and its importance is only going to grow. And because there are so many developers out there who already know how to use these technologies, we expect to see many more organizations following Google's lead in reaping the competitive advantage Ajax provides.

5 앞으로 나아가자! #

Ajax 어플리케이션을 만드는 데 있어 가장 큰 도전사항은 기술적인 것이 아닙니다. 핵심 Ajax 기술은 굳건하고 안정적이며 이해하기 쉽게 되어있습니다. 그대신, 도전대상은 어플리케이션 디자인에 있습니다 - 웹의 한계점들에 대해 알고 있다고 생각하는 것을 잊어버리는 것과 더 넓고 더 풍부한 가능성들을 상상하기 시작하는 것입니다.

분명 이건 재미있을겁니다.

6 Ajax Q&A #

(나중에...)

Valid XHTML 1.0! Valid CSS! powered by MoniWiki
last modified 2010-10-28 12:42:52
Processing time 0.5904 sec