의견.png

제이쿼리

해시넷
shoot008 (토론 | 기여)님의 2019년 7월 23일 (화) 11:44 판 (전망)
이동: 둘러보기, 검색

제이쿼리(jQuery)란 HTML 문서에 삽입하여 사용할 수 있는 자바스크립트 라이브러리를 말한다.
매우 쉽고 간단하기 때문에HTML, CSS, 자바스크립트에 관한 기초지식만 있다면 짧고 단순한 코드로 다양한 효과를 연출할 수 있다.

제이쿼리(jQuery)

개요

등장배경

제이쿼리는 미국 넷스케이프(Netscape)의 브렌든 아이크(Brendan Eich)가 개발한 스크립트 프로그래밍 언어자바스크립트(JavaScript)를 웹사이트에서 더욱 손쉽게 활용하기 위해 만들어진 오픈 소스 기반의 라이브러리이다.
2006년 1월 16일 웹 디자이너인 존 레식(John Resig)가 뉴욕 시 바캠프(Barcamp NYC)에서 공식적으로 소개했으며[1], 현재는 jQuery Team이라는 개발자 그룹이 jQuery Foundation을 통해 개발과 유지 보수를 담당하고 있다.[2]

특징

제이쿼리는 HTML의 클라이언트 사이드 스크립트 언어를 단순화하도록 설계된 브라우저 호환성이 있는 자바스크립트 라이브러리이다.
비교적 쉽고, 간단하며 더 많은 기능을 사용할 수 있어 인기를 얻을 수 있었다.[3]
HTML 문서 탐색 및 조작, 이벤트 처리, 애니메이션 및 Ajax를 활용할 때 유용하다.
수많은 라이브러리 중에서도 제이쿼리가 특이 많이 사용되는 이유는 다음과 같다.[4]

특징 설명
단순화
  • 불필요한 코드를 줄이고 간결한 형식으로 단순화시킴으로써, 코드 가독성과 개발 효율성을 크게 증가 시켰다.
  • 자바스크립트보다 코드가 간결하여 학습이 쉽다.
DOM
  • 문서 객체 모델을 좀 더 쉽게 접근하여 조작할 수 있다.
이벤트 연결
  • 이벤트 연결을 쉽게 구현할 수 있는 기능을 제공한다.
  • 브라우저마다 이벤트 전달 방식이 달라 생기는 브라우저간의 차이로 발생하는 문제점을 쉽게 해결할 수 있다.
크로스 브라우징
  • 웹 표준에 기반을 두어 제이쿼리로 다양한 브라우저에서 동작하는 코드를 작성할 수 있다.
  • PC와 모바일에서도 작동이 가능하다.
효율적인 셀렉터
  •  :empty, :odd, :even 등 CSS에서 사용되는 셀렉터를 이용하여 원하는 요소를 편리하게 선택할 수 있다.
  • 요소들(elements)을 선택하는 강력한 방법을 제공하여 선택된 요소들을 효율적으로 제어할 수 있는 다양한 수단을 제공한다.
시각적 효과
  • 시각적 효과를 쉽게 구현한다.
Ajax의 단순화
  • 제이쿼리를 이용하면 Ajax를 더욱 단순하게 만들 수 있어 Ajax 어플리케이션을 쉽게 개발할 수 있다.
애니메이션 구현
  • 웹 표준만으로 플래시와 실버라이트를 사용하는 것과 비슷한 효과를 구현할 수 있어 애니메이션 구현을 쉽게 할 수 있다.

장단점

  • jQuery 장점
  • 멀티 브라우저 지원
  • 코드가 단순하여 쉽게 사용 가능
  • 서버사이드 코드와 클라이언트사이드 코드를 효과적으로 분리작업, 분업작업이 가능
  • Ajax를 사용하고, 클라이언트객체를 통해 작업하여 페이지가 가볍고 빠름
  • 오픈 소스이므로 타개발자들의 소스를 분석 및 플러그인 형태로 붙혀 넣는게 쉬움
  • 구조적인 코딩이 가능하여 클라이언트용 RIA컨트롤을 만들기가 용이
  • jQuery 단점
  • 디버깅, 에러핸들링이 어려움
  • 코드 관리가 어려움
  • 업데이트의 문제
  • Virtual DOM과 상성이 안좋음

활용

종류

제이쿼리는 jQuery Team이라는 개발자 그룹이 jQuery Foundation을 통해 버전 개발 및 유지 보수가 진행되고 있다.

jQuery 버전 1

2006년 6월 30일 : 1.0a 버전 출시 최신 버전 : jQuery Core 1.12.4
jQuery 버전 1은 익스플로러 6, 7, 8 버전에서의 동작까지 모두 지원하는 버전이다.

jQuery 버전 2

2013년 4월 18일 : 2.0 버전 출시 최신 버전 : jQuery Core 2.2.4
jQuery 버전 2는 버전 1에서 지원하는 익스플로러 6, 7, 8 버전에 대한 지원을 중단한 버전이다.

jQuery 버전 3

2016년 6월 9일 : 3.0 버전 출시 최신 버전 : jQuery Core 3.4.1
jQuery 버전 3은 기존 버전과의 호환성을 유지한 채 더욱 간결하게 작성되고, 더욱 빠르게 동작하도록 변경되었다.

문제점

제이쿼리의 가장 큰 단점은 속도이다. 속도가 순수 자바스크립트로 코딩한 것보다 느리고, 특히 애미메이션을 할 경우, 브라우저가 지원하는 CSS 애니메이션보다 느린 경우가 많다. 브라우저는 특정 상황에서 GPU를 사용하여 애니메이션을 표현하기 때문에 훨씬 빠르다.
여기서 문제 되는 게 구형 브라우저일수록 더 느리다는 것이다. 제이쿼리를 하는 이유가 IE를 쉽게 지원하기 위해서이지만, 오히려 구형 브라우저에서 속도 문제를 야기할 수 있다.
또다른 문제는 코드 관리가 어렵다는 것이다. 제이쿼리는 코드가 간결하기 때문에 사람들이 쉽게 생각 할 수 있는데, 코드가 짧기 때문에 코드를 평소보다 많이 붙이게 되어 코드가 꼬이거나 겹칠 경우가 많다. 특히 자바스크립트를 접한지 얼마 안된 초보자들이 제이쿼리의 원리를 모른채 코딩을 하게 되어 코드의 품질이 낮아지는 문제가 있다.
또한 버전 2 부터 IE 8 이전 버전은 호환이 안되기 때문에 사람들마다 너무 다른 버전을 사용하고 있기 때문에 버전 1 을 사용하는 사람들의 경우 차후의 서포트를 받지 못하게 될 수 있다.

대안

제이쿼리는


각주

  1. Khan Academy, 〈jQuery의 역사: 존은 어떻게 jQuery를 구축했을까요?〉 , 《Khan Academy》, 2006. 1. 16.
  2. araikuma, 〈(jQuery) 개요〉,《티스토리》, 2018-11-09
  3. 제이쿼리 공식 홈페이지 - https://jquery.com/
  4. codedragon, 〈jQuery의 특징〉 , 《티스토리》, 2016-01-14

참고 자료

같이 보기


  의견.png 이 제이쿼리 문서는 프로그래밍에 관한 토막글입니다. 위키 문서는 누구든지 자유롭게 편집할 수 있습니다. [편집]을 눌러 이 문서의 내용을 채워주세요.