본문 바로가기

전체 글

Bay Area jQuery Conf 2011에서 관심 가는 동영상 몇 개 지난 4월 16일부터 17일까지 샌프란시스코에서는 jQuery 컨퍼런스가 열렸습니다. 국내에는 jQuery는 커녕 일반적인 자바스크립트 또는 자바스크립트를 포함한 UI 개발 관련 행사가 하나도 없다는 점을 생각해보면 이런 특정 라이브러리의 컨퍼런스가 열릴 수 있다는 것은 부러운 일입니다. jQuery Conf 2011의 세션을 잠시 살펴보면 모바일에 대한 내용, 개발 방법이나 퀄리티 도구를 사용하는 방법, 유닛 테스트, jQuery의 활용, 하이브리드 모바일 앱 등 이제는 단순한 jQuery의 활용을 벗어나 다양한 주제에 대한 내용이 포함되어 있습니다. 점점 대단하다는 생각밖에 들지 않네요. 이 중 몇 개의 세션을 녹화한 동영상이 온라인에 공개되어 있는 것을 우연히 발견했습니다. 동영상 중 제가 관심있는.. 더보기
일주일간 모은 링크 #6 Google URL Shortener gets an API 구글의 단축 URL서비스인 goo.gl의 API가 드디어 오픈되었습니다. 이미 bit.ly등 단축 URL 서비스를 제공하는 다른 곳에서도 제공하고 있기 때문에 빠른 시간 내에 오픈될 것으로 기대하던 참입니다. bit.ly같은 경우 이미 많은 서비스에서 사용하고 있기 때문에 굳이 구글을 기다릴 필요는 없었지만 구글이라면 뭔가 다르지 않을까 하는 기대가 있었나 봅니다. 아직 랩에 등록된 API이므로 예고 없이 변경될 수 있다는 부분이 아쉽다면 아쉬운 부분이네요. Namespacing in JavaScript JavaScript에서 네임스페이스를 이용하여 구조적으로 JavaScript를 짤 수 있는 방법에 대해 설명하고 있습니다. 네임스페이스를 사용하.. 더보기
About jsperf.com 이번엔 jsperf.com 사이트를 소개할까 합니다. 자바스크립트 코드블럭들(JavaScript Snippets)에 대해서 어떤 코드블럭이 더 성능이 좋은가 테스트하는 것입니다. 자바스크립트 언어의 특성상(다른 언어도 마찬가지지만) 하나의 기능을 구현할 수 있는 코드는 다양합니다. 어떤 코드가 더 성능이 좋은지는 프로파일러를 이용하거나 직접 시작 끝 속도를 측정해서 비교하는 방법 등등 여러가지가 있는데, jsperf.com 을 이용해 보는것도 좋은방법일것 같습니다. jsperf의 측정방법 내부적으로 Benchmark JS 라이브러리를 이용하고 있습니다. jsperf 사이트에서는 사용자가 테스트하고자하는 코드블럭들을 특정 시간동안 수행하면서 얼마나 완료시키는지 측정하는 방법을 사용합니다. 많이 완료하면 .. 더보기
HTML5 - 쿠키 vs. 로컬스토리지 (local storage) 일전에 모바일웹에서 사용자의 특정 값을 비로그인 환경에서 보관해야 할 개인화된 정보가 있었습니다. 당연히 쿠키를 사용하면 쉽게 해결 될 수 있는 것이였습니다. 하지만 모바일 환경이라는 점(HTML5를 보다 잘 지원함으로)으로 쿠키를 대체할 수 있는 기술을 검토해 봤습니다. 여기저기 흩어져 있는 자료를 모은 정도이지만 그때 검토하기 위해 정리한 자료를 공유합니다. (Mindjet이라는 MindMap을 사용해서 그림이미지로 첨부합니다) 모바일웹에서는 로컬스토리지 사용이 충분히 가능한 상황임을 알게 되었습니다. 특히나 모바일에서는 성능문제가 PC보다 민감하다고 볼 수 있는데요. 쿠키의 경우 HTTP Header에 매번포함되어야 하는 문제도 있습니다. 물론 쿠키의 얼마 안되는 사이즈가 중요한 문제는 아니긴 합니.. 더보기
Javascript(Ajax) 개발자에게 필요한 역량 제목을 UI 개발자로 하려다가, Javascript 개발자로 변경했습니다. 정확히 Javascript만을 주로 다루는 개발자는 굉장히 드믑니다. 하지만 웹개발의 이동이 Ajax나 Javascript으로 이동함으로써 Javascript만을 주로 다루는 개발자가 많아지고 있으며 그만큼의 전문성이 웹에서 요구되고 있습니다. Front-End가 무거워지고 복잡해 짐으로써 비 전문가들의 개발로 인해 웹페이지는 사용자들에게 더 좋은 경험을 주지 못하고 있습니다. 이것은 웹의 발전과 사용자의 경험이 비대칭으로 이뤄지는 형태라서 이것에 대한 책임을 웹개발자가 어느정도 책임을 지고 있어야 합니다. 이러한 문제를 해결하기 위해 3가지를 중점적으로 Javascript 개발자의 필수 역량이라고 생각됩니다. 첫째. 마크업과 C.. 더보기
JavaScript 특징의 이해 - JS의 중심 Function 살펴보기(2) Callback Function 먼저 아래의 예제를 살펴봅니다. function execCode(callback){ //함수내용이 어쩌구 저쩌구 callback(); //이러쿵 저러쿵 } function makeToy(){ //이리저리 주절주절 } execCode(makeToy); 위의 예제에서 makeCode함수를 callback함수라고 합니다. 이러한 callback함수는 어디에 사용될까요? 첫번째로 event listener로 사용됩니다. document.addEventListener("click",eventFunction(),false); 이벤트가 실행될때 어떠함수가 실행되도록 지정하는 것도 일종의 callback함수입니다. 두번째로 Timeout()가 있습니다. var testFun=functi.. 더보기
What is a non-blocking script? 최근들어 부쩍 Front-End Optimization에 대한 이슈가 부각되고 있다. 웹서비스는 더욱더 많은 기능을 탑재하고 있으며 노출되는 컨텐츠 또한 정적인 컨텐츠에서 동적인 컨텐츠로 변경되고 있다. 이로인해, 전통적인 최적화의 방법중 캐시를 적용하는 방법이 있는데 이또한 효과가 점점 떨어지고 있는것이 사실이다. 또한, 페이지를 이동하며 컨텐츠를 제공하는 전통적인 방법에서 한 페이지에 머무르면서 사용자 요구사항에 부응해야 하며 더 많은 동적인 컨텐츠를 제공하는 방법으로 변화하고 있다. 그런데, 이런 기능이 많아지면 많아질수록 자바스크립트의 양이 많아 지는데 이는 서비스 진입시 페이지가 하얗게 보이는 시간을 더 길게 하는 주요 원인이 된다. 아래의 문제를 알기쉽게 설명해놓은 글이 있어서 소개하려고 한다.. 더보기
JavaScript 특징의 이해 - JS의 중심 Function 살펴보기(1) JavaScript(이하 JS)라는 언어는 다른 언어와 달리 몇가지 특징을 가지고 있습니다. 그런 특징들은 사실 UI를 개발하는데 매우큰 걸림돌이 되지는 않는것 같습니다. 이는 언어적인 자유도가 상대적으로 높은 JS에서 잘못된 패턴을 허용하기 때문이기도 합니다. 몇가지 언어적인 특징을 이해하기 앞서 가장 중요하다고 생각되는 Function , Object , Scope등을 앞으로 단계적으로 작성해보려고 합니다. 저도 이기회에 몇가지 참고할 수 있는 책과 웹을 탐독한 후 머리속에 정리되는 내용을 적어보려고 합니다. 어쩌면 짜집기식의 내용취합일 수 도 있지만 그래도 몇가지 책에서 이해하기 어려운 부분을 쉽게 작성해보려고 노력해 보겠습니다 ^^ Function - 삼형제 Function의 그 종류부터 알아보겠.. 더보기

반응형