모바일에서 jQuery 대안 - zeptojs

zeptojs

모바일에서 jQuery의 대안

참조 URL

1. http://zeptojs.com
   
2. http://zeptojs.com/#platforms - 호환 브라우저
   

 jQuery 문법에 호환되는 라이브러리로 9.7k의 용량을 가지고 있다. IE를 제외한 대부분의 브라우저에서는 호환이 되고 있으므로 모바일 전용 페이지를 만들때에는 고려해보면 좋을 것이다.

 zeptojs는 jQuery를 대체하기 위해 나온것은 아니며 모바일에 특화된 성격을 같고 있으며 jQuery에 익숙한 사용자들이 쉽게 접근 가능 하도록 하고 있다. 아래 '코드1'은 zeptojs의 예제  코드다. 

// 모든 div 테그를 검색 $('div'); // id가 foo인 테그 검색 $('#foo'); // P 테그 생성 $("<p>Hello</p>") //=> the new P element // 테그 생성 및 속성 할당 $("<p />", { text:"Hello", id:"greeting", css:{color:'darkblue'} }) //=> <p id=greeting style="color:darkblue">Hello</p> // 페이지 초기화된 후 최초 실행 function Zepto(function($){ alert('Ready to Zepto!') })

[코드1] zeptojs 예제 코드

 selector 문법이 jQuery와 같아 따로 학습 곡선없이 사용할 수 있을 것이다. 아래 '코드2'는 ajax를 사용법이다. 중요하다고 생각되어 한번 더 살펴 본다.

$.ajax({ type: 'GET', url: '/rsvp', // 데이터 data: { name: 'Zepto.js' }, // 리턴 타입 지정 dataType: 'json', timeout: 300, context: $('body'), success: function(data){ }, error: function(xhr, type){ alert('Ajax error!') } }) $.ajax({ type: 'POST', url: '/rsvp', data: JSON.stringify({ name: 'Zepto.js' }), contentType: 'application/json' })

[코드2] zeptojs의 ajax 예제 코드

 일반 웹 페이지가 아닌 제한된 요건(예 모바일 전용 사이트)에서 속도가 중요시 된다면 한번 고려해 볼 수 있는 라이브러리라 할 수 있겠다.