머드초보의 블로그

보니까 1.3.2버전이 작년 1월에 릴리즈가 된 것으로 나오네요. 1.4는 14라는 숫자 때문인지 1월 14일날 릴리즈가 되었습니다.

jQuery사이트 : http://jquery.com/
근데, 재미있는 것은 14 Days of jQuery라는 이벤트(?)를 하네요. 보면 매일매일 하루에 한개씩 뭔가 공개를 하는 듯하네요. 28일까지 진행되는 것  같습니다. 14일 당일에는 jQuery 1.4를 공개했네요. 내일은 뭘 공개할지^^
Javascript 라이브러리 릴리즈로 이벤트를 하다니.....-_- 파는 제품도 아닌데.....대단합니다. jQuery의 위엄인가.....
이벤트 사이트입니다 : http://jquery14.com/

jQuery는 간결하면서도 강력한 코드를 작성할 수 있는 좋은 Javascript Framework죠. jQuery가 내건 문장인 "write less, do more"는 jQuery를 표현하는데에 전혀 부족함이 없는 문장이죠. 모든 브라우저에서 동일한 코드로 작성할 수 있다는 것은 기쁜 일입니다(누가 대체 이런 일을 기쁘게 만들었을까....-_- 브라우저만 다 표준을 지키면 될텐데ㅠㅠ). 아마 jQuery는 하늘에서 내려온 천사같은 것이죠-_-

jQuery는 확장성 있는 개발을 할 수 있어 다수의 플러그인이 존재를 하는 것도 하나의 장점입니다. 그래서 빠르게 개발을 하거나 변경이 자주 일어나는 시스템에 매우 유용합니다.
하지만, jQuery의 단점은 Javascript Framework이다 보니 퍼포먼스의 문제가 있다고 합니다. 사실 Framework는 뼈대같은 것인데, 이런 뼈대를 설계를 하는 이유는 유지보수성 때문에 현업에서도 Framework를 개발해서 사용하죠. Framework를 개발하면 확장성과 유지보수성 등의 시스템 변경에 유용하며 기존코드를 건드리지 않는 구조로 개발할 수 있기 때문이죠.
이런 jQuery도 크로스브라우징과 짧고 간결하고, 쉬운 개발형태를 지향하다보니 퍼포먼스는 그냥 순수 Javascript로 개발할 때보단 확실히 떨어질 수 밖에 없습니다.

하지만, 이번 1.4버전에서 크게 향상된 점이 있는데, 그것이 퍼포먼스 향상이더군요^^

jQuery 1.4 Released 에 Features(특징들)에 보면 가장 처음에 나오는 것이 Performance Overhaul of Popular Methods입니다.

Performance Overhaul of Popular Methods(인기있는 메소드의 성능점검)
초딩 영어실력으로 읽어보니 기존에 것을 분석해서 복잡도를 감소해 함수 호출 수를 줄인 것 같네요.
암튼, 결론은 더 빨라졌다는 거겠죠-_-

Easy Setter Functions(쉬운 Setter 함수)
기존에는 Setter에 그냥 string값 같은 것만 넣을 수 있었는데, 이제는 함수를 넣어서 처리할 수도 있네요.

Ajax
Ajax따위.....그냥 더 좋아진 듯-_-

Attribute
css()랑 attr()등의 함수의 성능이 향상된 듯. 그래플 보여주는데, 1.3.2와 1.4간의 차이가 거의 2배네요.

Core
쉬운 엘리먼트 생성이 가능해지네요. 생성과 동시에 css랑 event등을 추가할 수 있는 형태로 만들 수 있네요.
그 외에 함수가 추가되거나 바뀌거나 한 듯.

CSS
이것도 2개정도의 퍼포먼스 향상이 된 듯.

아.....바뀐게 디게 많네......하긴 1년을 개발했으니......-_-
암튼, 직접 가셔셔 보시는 게......더 좋을 듯....^^

ps. 이런 것을 만드는 천재분들 때문에 저 같은 하찮은 개발자들이 먹고 사는 것 같아요^^

아...좀 문제가 발생할 것 같기도 하지만-_- 괜찮을꺼에요-_-[code]localStorage.getItem("데이터명");
localStorage.setItem("데이터명", 데이터);
localStorage.clear();
[/code]
크롬 플러그인에서 배열을 저장하기위해서는 json으로 변경할 것이 필요한데, JSON관련된 라이브러리를 제공하더라구요. 스트링화 하고, 파싱하는 함수를 사용하면 됩니다.
[code]localStorage.setItem("저장배열명", JSON.stringify(array));
JSON.parse(localStorage.getItem("저장배열명"));[/code]

나중에 시간되면 크롬용 MP3Player도 만들어봐야겠어요. NPAPI를 제공하는 것 같아 로컬파일 접근도 되는 것 같아요(확실하진 않지만....-_-).

Javascript로 개발하다보면 값을 확인하기 위해 alert을 가끔씩 찍습니다-_- 요즘은 FireBug와 같은 Javascript 디버그 툴들이 참 많이 있긴하죠.
FireBug는 console.log를 통해서 메세지를 찍을 수 있죠.
하지만, FireBug를 켜지 않으면 에러를 뿜어버리는 단점이 존재를 하죠-_- 그래서 가장 간단히 값을 확인하는 것은 역시나 alert이죠. 하지만, alert의 단점은 마우스동작으로 인한 값을 추출하기 위해서는 확인하기 힘든 단점이 있어요.
마우스로 드래그앤드랍을 하는 사이에 값을 확인하고 싶은데, 거기서 얼럿이 떠버리면 확인하기 힘들죠-_-

그 단점을 극복해주는 Blackbird라는 놈이 있는데요. 이름 참 잘 지은 것 같네요. 웹사이트에서 검은창으로 떠다니는 디버그메세지창을 보여주거든요-_-

아래는 다운받고 데모를 볼 수 있는 사이트입니다.
http://www.gscottolson.com/blackbirdjs/

사이트 방문하시면 사용법은 그냥 알 수 있구요.
추가도 그냥 해당 사이트에 js와 css파일을 추가만 하시면 바로 쓸 수 있습니다^^
그리고 웹사이트 한쪽 구석에 나오게 되는데 저것에 의해서 화면이 가려질까봐를 염려한-_- 창 이동 단축키가 존재합니다-_-
단축키로 창을 보이고 안보이게 할 수 있습니다. 클리어로 창 내용을 지울 수도 있구요^^

로그찍는 것도 로그레벨에 따라 찍을 수 있어서 좋네요. 그리고, 프로파일링 기능(이라고 하기에 좀 뭐한-_-)이 있는데, 성능을 개선을 위한 수행시간 측정을 해주는 기능도 제공합니다^^

다만 아쉬운 점이 있다면 객체나 배열을 한번에 로그로 찍을 수 있는 기능이 없네요.
Arthropod이라는 Adobe AIR로 개발된 Flash디버그메세지창이 있는데요(이것과 매우 비슷하죠^^). 이것은 그냥 Debug.object(object명); 이라고 치면 그 객체정보가 다 나오는 기능이 있죠.
배열도 Debug.array(array명);하면 배열내용을 확인할 수 있구요.

그래도 크로스브라우징으로 로그를 찍을 수 있어서 참 좋은 듯^^ FireBug는 FireFox에서 밖에 안되서-_-

PS. 이 프로그램은 http://twitter.com/xguru님으 트위터를 빨로우 하다가 발견했습니다. 역시 트위터의 힘은 대단한 것 같아요^^ 감사해요~

이런 IDE도 있군요.
지원하는게 좀 특이하군요.
Ruby on Rails, Adobe^® AIR™, Apple iPhone(아이폰!!!), PHP(EditPlus면 만사오케이인데^^)를 지원합니다.

우선 이클립스 기반이어서 이클립스 플러그인 형식으로도 설치를 할 수 있습니다.
그냥 설치하면 플렉스빌더처럼 StandAlone형태로 돼요.
http://www.aptana.com/studio/download
여기서 받으면 되구요.
다음 신공으로 설치하면 됩니.....아 안된다-_-;
선택 사항이 하나 나오는데요. 파일을 Aptana Studio랑 연결할꺼냐고 묻는데 연결하고 싶으면 다 선택하시고 연결하기싫으면 해제해야겠죠? ^^ 어쨌든 설치가 완료되고 실행해봅시다-_-;
무슨 경고창이 뜹니다-_-; FireFox를 깔라고 하네요-_-;
가볍게 깔아주든지 그냥 무시합시다-_-;
보면 이클립스랑 완전 똑같군요-_-;

프로젝트를 만들어봅시다.
File -> New -> Project -> .....아....아무것도 없군요.
AIR플러그인을 설치해야합니다.
처음에 나오는 Aptana Start Page에서 Plugins에서 중간쯤에 Adobe^® AIR™가 보일껍니다.
Download and install클릭하면 Adobe AIR Support체크하고 설치하면 됩니다.

그럼다시 프로젝트를 만들어봅시다-_-;
File -> New -> Project -> AIR Project가 생겼습니다.
Project이름은 HelloAir -_-;
Next로 끝까지가면 Ajax Library를 선택할 수 있어요^^
저는 Ajax를 모르므로 ㅠㅠ 그냥 Finish를.....ㅠㅠ

왼쪽 아래에 Project를 보면 AIRAliases.js파일이 꼭 필요한데 알아서 집어넣어줍니다.
저거 혼자서 다하려면 AIR SDK에서 가져와서 추가해줘야해요.
위에 RUN을 해보면 애플리케이션이 뜰꺼에요 ^^
air객체를 통해서 air관련된 것을 접근해서 쓸 수 있어요!
air.trace("") 하면 trace도 찍을 수 있답니다-_-;

Aptana의 가장 큰 단점!
아직 디버깅이 안돼요-_-;