Andrew Dupont씨가 Practical Prototype and Script.aculo.us를 쓰셨습니다. 그리고는 읽어볼만한 4장을 PDF 포맷으로 다운로드 받을 수 있도록 했습니다. 하지만 영문권 책이라 아마도 이 블로그에 오시는 분들에게는 조금은 먼 이야기가 될 것 같습니다. ^^a

from Book Excerpt: Practical Prototype and Script.aculo.us, Advanced Ajax Chapter 4

WWDC의 iPhone 3G 발표때로 회상해보면, 다음 큰 건은 Mobile Me의 런칭일 것입니다. Mobile Me는 표준 웹 기술을 사용해 Apple의 서비스에 접근하기 위한 눈길을 끄는 사용자 경험입니다.

이 응용프로그램은 SproutCore 프레임웍을 이용해 작성되었으며, Dion씨가 이에 설립자 중 한명인 Charles Jolley씨와 인터뷰를 했습니다.

프로젝트의 역사, 다른 프레임웍과의 차이, 앞으로의 방향 등에 대해서 얘기를 나누었습니다. 재밌는 점은 이 팟 캐스터가 마찬가지로 Cocoa에서 영감을 받은 280 North 다음이라는 것입니다.

SproutCore가 JavaScript에 좀 더 많이 집중하고 단순하고 직관적인 방법으로 클라이언트에서 MVC를 할 수 있도록 하긴 합니다. Rails 플러그인에서 출발해 어떻게 개발해왔는지가 꽤 흥미로웠습니다(Rails에 의존적인 것은 아니었고, 몇 개의 빌드 파일이 Ruby였을 뿐입니다).

Charles씨는 그들이 개발자들에게 빠른 응용프로그램을 제공하기 위해 사용한 기술과 리치 브라우저 응용프로그램들이 계속 브라우저 벤더들을 더 빠르고 유려하게 되라고 압박하는 바에 대해 느끼는 점을 말했습니다.

이 인터뷰는 직접 들으실 수 있으며, 팟 캐스트를 구독하실 수도 있습니다.

from Audible Ajax Episode 27: SproutCore with Charles Jolley

XMG Networks에서 72photos라는 새로운 온라인 사진 공유 사이트를 론칭했습니다. Ajax를 아주 많이 사용했고 부분적으로는 Apple의 iPhoto 08이 생성하는 웹 갤러리에 영감을 받은 것 같습니다.
Ben씨는 72photos에 사이트를 작성한 과정과 Flickr등의 경쟁자들과의 비교를 물어보았고 "Eric A"씨가 친절하고 자세하게 답변해주었습니다:

사이트 작성
프로젝트 초기부터 Prototype / Scriptaculous를 자신들의 메인 JavaScript 프레임웍에 사용해왔다고 합니다. 기능들은 웹에서는 독특하고 특히 패키징된 프레임웍에서는 아직도 선보인 적이 없다고 합니다(최소한 그들 생각에는요). 그래서 처음부터 만들기로 했다는군요.
 
기능 
기능면에서 고민이 조금 있었나봅니다. 초보자들이 사용할만한 기본 기능을 알맞게 튜닝하는 것도 중요하지만, 전문가들이 쓸만한 고급 기능을 제공하는 것도 중요하게 생각했었기 때문입니다. 이 둘 사의 균형을 찾기가 쉽지는 않았던 것 같습니다만, 어느 정도 진행이 된 것 같고 실험적인 기능들도 적용해볼 예정이라고 합니다.

다른 사진 공유 사이트와의 비교

1. 완전히 커스터마이징 되는 사진 갤러리 - 우리의 갤러리 인터페이스는 사진을 갤러리에 추가하고 정렬하기위한 드래그-앤-드롭 기능을 제공합니다. 실시간 커스터마이징 옵션은 사용자들이 실시간으로 갤러리의 색상과 글꼴을 커스터마이징 할 수 있게 합니다. 몇 개의 미리 설정된 갤러리 테마도 사용가능합니다. 다음은 예제 화면입니다:

2. 프로파일 페이지 - 모든 사용자는 자신들의 사진, 태그, 갤러리를 품위있게 표시하는 완벽한 프로파일 페이지를 가집니다.

3. 커뮤니티 기능 - 커뮤니티 기능또한 다른 사이트보다 우수합니다. 친구들의 최근 업로드나 갤러리를 보는 것으로 그들의 활동을 추적할 수 있는 기능과 친구들의 유형(친구/가족)을 정하고 여러분의 사진/갤러리/프로필을 수정할 수 있는 권한을 줄 수 있습니다.

4. 편집 - 편집 기능은 Ajax / JavaScript 를 통해서 이루어지고, 기본적인 크롭, 여러 효과, 화질, 비율 고정등의 기능을 다룹니다. 또한 단계별 버저닝(우리의 기본적인 버저닝 기능과 비교되는)과 더 많은 편집 효과와 관리 기능(배치 편집, 워터 마크 등)을 포함한 보다 다양한 굳건한 기능들을 곧 선보일 것입니다.

5. 웹스페이스 - 우리는 늘 사용자들의 풀사이즈 사진들을 저장하고 개별 사진에 크기나 월별 용량 제한을 두지 않았습니다. 계정 유형(무료 혹은 프로)에 따른 전체 용량의 제한만 있을 뿐입니다.

6. 사용성 - 모든 백엔드 기능은 "실시간"으로 라이트박스 창에서 이루어지기때문에, 최소한의 페이지 리로드만 일어나며 이는 사진과 갤러리를 작업하는데 있어 상당한 효율성의 증가를 가져왔습니다.

앞으로는 커뮤니티 기능을 조금 더 확장하고 사진작가와 예술가들이 그들의 작품을 팔 수 있는 공간도 제공할 계획에 있다고 합니다.

from 72photos: Proto/Scripty Photo Sharing Site

Thierry Schellenbach씨가 자신의 Prototype 응용프로그램에서 console.profile() / console.profileEnd()를 실행해본 후에 Prototype 응용프로그램에서의 JavaScript 성능 향상팁에 대한 글을 작성했습니다.

요점은 단순합니다:

• $$와 이벤트 바인딩에 주의할 것
• 다른 Prototype 메소드에 주의할 것(innerHTML과 element.update() 간데는 40배나 차이가 난다는 보고가 있습니다)
• document.createElement 대신 innerHTML 을 이용해서 작성할 것
• for in 루프 대신 for 루프를 사용할 것
• 문자열 합치기에 += 대신 Array.join 을 사용할 것^[각주:1]
• 변수와 함수를 캐시할 것
• eval의 사용을 제한할 것
• Try Catch 구문의 사용을 제한할 것
  
• DOM을 다룰 때는 엘리먼트 밖에서 DOM을 변경하고 다시 집어넣을 것(DOM 안에서 변화시키면 브라우저가 그 때마다 화면을 다시 그리려고 시도해서 느려질 수 있습니다)
  

시간 같은 요소가 더 추가되어 성능 측정이 되면 좋을 것 같습니다. 반론을 기다린다고 하는군요 ;)

from Some more JavaScript performance tips on Ajaxian

David Kees씨가 Prototype을 이용한 JavaScript 파일 로딩에 대한 글을 썼습니다. 이는 DOM 엘리먼트가 사용가능한 이벤트 스크립트를 이용해 로딩 기능 기술을 구현한 것입니다.

그는 아쉬운 점을 해소하기 위해 그 기술을 사용했습니다:

이 사이트의 달력은 블로그에 관련된 정보를 보여주는 페이지에서만 나타납니다. 달력은 페이지를 모두 리로드하지 않고도 달만 바꿀 수 있도록 JavaScript로 개선되었습니다. 저는 이러한 개선기능들이 달력이 있는 어디서든 사용가능하게 하기 위해 두 가지 옵션을 생각해냈습니다:

1. JavaScript를 필요로 하는 모든 페이지에 JavaScript 파일을 포함하는 코드를 직접 적는다. 좋은 방법이고, 예전부터 잘 되던 방식이지만, 사람들이 때때로 JavaScript가 필요한 새 페이지에 파일을 포함하는 것을 생각 못하거나 깜빡해버리는 경향이 있다.
2. JavaScript가 필요해질 때 자동으로 파일을 포함할 수 있는 방법을 찾는다. JavaScript가 필요한 새 페이지를 추가할 때 파일을 포함하는 걸 기억해낼 필요가 없지만, 페이지가 로드되었을 때 JavaScript를 조금 더 오래 실행해야 한다.
   

다음은 구현 예제 코드입니다:

from Lazily load functionality via Unobtrusive Scripts on Ajaxian

Ajxaian에서 특별한 주간을 가지기로 했나봅니다. Ajax 개척자들의 동영상을 찍어서 공개하기로 했다는군요. 다음 사람들을 인터뷰할 예정이라고 합니다:

• Prototype의 Sam Stephenson
• GWT의 Bruce Johnson
• Dojo의 Alex Russell
• jQuery의 John Resig

이번엔 Prototype의 Sam Stephenson씨로 다음 사항에 대한 그의 생각을 들어보았다고 합니다:

• Prototype의 미래
  
• Prototype 새 버전의 흥미로운 점과 그들이 풀려고 하는 문제
• 최근 브라우저들에 대한 생각, 그리고 그가 보고 싶어하는 것

인터뷰에서 그는 새로운 인라인 문서화 도구인 pdoc,  Sprockets, 새로운 이벤트 위임 기술 등에 대해 논의했습니다.

from Ajax Pioneer Week: Sam Stephenson of Prototype on Ajaxian

Twistori는 Amy Hoy씨와 Thomas Fuchs씨가 만든 재밌는 사이트입니다. 기대하셨듯이, 디자인이 이 응용프로그램의 중요한 부분이고,  Prototype / Script.aculo.us 의 조합이 더해졌습니다.

이 사이트는 실시간 twitter 검색 툴인 summize를 이용해 매우 다양한 주제(love, hate, think, believe, feel, wish)를 실시간으로 끌어오고 있습니다.

관련 소식이 있다면서 Dion씨가 자신이 만든 Grease Monkey 용 Twitter 번역 스크립트를 광고하시네요 ^^

from Twistori: Telling a story with Tweets and Script.aculo.us on Ajaxian

Stephen Celis 씨가 날짜 범위를 입력할 때, 날짜 선택기를 두 번 사용하는 것에 짜증이 났나봅니다. 그래서 드래그로 날짜를 선택할 수 있는 timeframe를 만들었습니다(제 성격하고 비슷하네요).

Prototype을 기반으로 작성되었고, 이런 식으로 사용할 수 있습니다:

그러면 이런 화면을 볼 수 있죠.
데모를 직접 테스트 해보실 수도 있습니다. 조금만 더 이뻤으면 좋았겠다라는 아쉬움은 살짝 드네요 ^^;;

from Timeframe: Prototype date range component on Ajaxian

Pierre Chassaing 씨가 Prototype과 Script.aculo.us를 이용해서 JavaScript로 ProtoRPG라는 롤 플레잉 게임을 만들었습니다. 느낌은 꼭 NetHack 스타일인 것 같습니다.

이 글은 현재 Ajaxian 에서 삭제된 상태입니다.

from Mad Mimi: WYSIWYG Email Marketing on Ajaxian


Mad Mimi는 메일을 이쁘게 꾸며서 보낼수 있도록 해줍니다.동영상을 보면 만드는 것은 30초면 된다고 사이트 첫머리에 써놓을 정도로 쉬워보입니다. 디자인 감각이 없는 사람들도 간단히 만들어져있는 모듈을 추가하고 이미지를 Drag & Drop, 텍스트를 작성하면 메일이 됩니다.

사용방법은 설명할 것도 없이 단순해서, 그림2 처럼 자신의 레이아웃을 만들고 내용을 채우면 됩니다.



일단은 100명까지 볼 수 있는 Free Account 로 실행해볼 수 있습니다.

Piotr Solnica 씨가 예전에 jQuery와 Prototype에 관한 두 개의 포스트를 썼는데, John-David Dalton 씨가 찾았네요.

첫번째 글에서는 다음과 같이 테스트를 진행했습니다:

그리고 결론입니다:

테스트 결과, 삽입 메소드는 개선되어야 할 필요가 있지만 Prototype이 jQuery보다 빠른 것 같다. Prototype 보다 jQuery 같은 문법을 좋아하기는 하지만, 성능은 코드 몇 줄 절약하는 것보다 더 중요하다. 물론 내가 만든 테스트가 이 라이브러리들이 실제 응용프로그램에서 어떻게 동작하는지를 보여줄 수는 없다. 그것은 이 글 다음에 쓸 작업이다. 결과에도 불구하고 나는 jQuery가 매우 흥미롭다는 것은 인정한다. 내 일반적인 느낌은 이 라이브러리가 Prototype보다 조금 더 성숙한 것 같다는 것이다.

두번째 글에서, Piotr씨는 Firebug 프로파일러를 이용하는 실행 테스트 대신 스스로 만든 JavaScript 기반 테스트 환경을 사용했습니다. 덕분에 테스트 수트가 여러 브라우저에서 동작하게 되었습니다:

Prototype은 15가지 항목에서 jQuery 보다 최소 2배 정도 빨랐고, jQuery는 8가지 항목에서 Prototype 보다 빨랐다. 어떤 라이브러리를 선택해야할까? 내 경우라면, Prototype인데, jQuery와 같은 기능을 제공해주면서도 빠르기 때문이다. jQuery는 아마도 이쁜 UI 효과가 필요한 프로젝트에 어울릴 것 같지만 그냥 내 생각일 뿐이다. 틀렸으면 바로 잡아주기 바란다...

from jQuery and Prototype Benchmarks on Ajaxian

from qGallery: Prototype gallery application on Ajaxian

Sebastian Brink 씨가 꽤 그럴 듯한 갤러리 프로그램인 qGallery 를 만들었습니다. PHP 기반인 것 같은데 아직 릴리스는 안된 것 같습니다. 완료하면 릴리스하겠다고 하네요.
아직 작업중인지 IE에서도 FF에서도 에러가 나서 직접 확인해보기는 힘들군요.