인기 있는 JavaScript 라이브러리는 jQuery, MooTools, Prototype, Dojo, YUI 등 셀 수 없이 많습니다. 이러한 JavaScript 라이브러리는 기능이 풍부하고 플러그인을 사용하면 거의 모든 작업을 수행할 수 있지만 이로 인해 웹 페이지 크기가 커지는 경우가 많습니다. 어떤 경우에는 특정 작업만 완료하려는 경우 보다 전문화된 기능을 갖춘 일부 경량 라이브러리를 사용할 수 있습니다. 이 기사에서는 40가지 뛰어난 경량 JavaScript 라이브러리를 소개합니다.
1. 양식 관련
직접 사용할 수 있는 양식 유효성 검사 기능을 포함하여 가장 일반적으로 사용되는 JavaScript 양식 기능을 단순화하는 간단한 오픈 소스 프로젝트입니다. 또한 강력한 양식 동기화 및 양식 조건 판단 기능도 포함되어 있습니다.
또 다른 간단한 JavaScript 양식 유효성 검사 프레임워크입니다. 여기에는 통합된 논리가 있으며 일부 설정은 전역, 개별 양식 또는 개별 개체가 될 수 있습니다. AJAX 지원, 캐싱, 콜백 기능을 통합하는 두 가지 API를 제공합니다. HTML과 유사한 API 문은 물론 객체 지향 JavaScript API도 제공합니다.
LiveValidation( http://www.livevalidation.com )
경량 양식 검증 라이브러리. 기존의 인증 기능 외에 실시간 인증도 제공하며, 한번 입력하면 인증이 가능합니다. Ruby on Rails 사용자는 명명 규칙과 매개변수가 매우 유사하기 때문에 이 라이브러리가 유용할 수 있습니다. 라이브러리에는 독립형 버전과 프로토타입 버전이 모두 있습니다.
yav ( http://yav.sourceforge.net/en/index.html )
강력하고 유연하며 확장 가능한 양식 검증 라이브러리입니다. 날짜, 이메일 주소, 정수 등의 간단한 유효성 검사부터 정규 표현식과 같은 복잡한 유효성 검사까지 다양한 시나리오를 지원합니다. 내장된 AJAX 지원으로 출력 오류 메시지를 개체 수준에서 찾을 수 있습니다.
qForms ( http://www.pengoworks.com/index.cfm?action=get:qforms )
양식 처리를 위한 완벽한 솔루션입니다. 기능에는 다양한 유효성 검사 규칙, 다중 게시를 방지하는 메커니즘, 입력 필드를 잠그거나 잠금 해제하는 기능이 포함됩니다.
양식개혁( http://code.google.com/p/formreform/ )
테이블 기반이 아닌 다중 열 디자인은 항상 어려운 과제였습니다. 이 작은 라이브러리는 전통적인 형식을 아름다운 다중 열 형식으로 바꿉니다.
2. 애니메이션 관련
$fx( http://fx.inetcat.com/ )
HTML 객체를 애니메이션화하기 위한 경량 라이브러리입니다. 타임라인에서 CSS 속성을 변경할 수 있으며, 복잡한 애니메이션의 경우 효과를 결합하고 개체를 그룹화하고 병렬로 움직이게 할 수 있습니다.
JSTweener( http://coderepos.org/share/wiki/JSTweener )
중간 프레임을 생성하는 JavaScript 라이브러리로, API는 유명한 중간 프레임 엔진 Tweener와 유사합니다. 애니메이션 시간을 지정하고 전환 효과 및 지연을 정의할 수 있습니다. 이벤트는 거의 모든 지점에서 발생할 수 있습니다.
페이스북 애니메이션( http://developers.facebook.com/animation/ )
사용자 정의 가능한 CSS 기반 애니메이션을 만들기 위한 강력한 도구입니다. Facebook 애니메이션에서는 몇 줄의 코드로 UI를 개선할 수 있습니다. 구문은 FBJS(Facebook용 라이브러리)와 동일합니다.
FX( http://ryanmorr.com/archives/fx-lightweight-and-standalone )
거의 모든 CSS 속성에 대해 중간 프레임을 생성할 수 있는 YUI와 유사한 구문을 갖춘 경량 JavaScript 라이브러리입니다. 색상 및 스크롤 애니메이션을 지원하며 개체의 값을 설정하기만 하면 됩니다.
3. 시각 및 그래픽 효과
JS 차트( http://www.jscharts.com/ )
막대 차트, 원형 차트, 단순 곡선 차트를 지원합니다. 이 라이브러리를 웹 페이지에 직접 삽입하고 XML 파일이나 JavaScript 배열 변수에서 데이터를 호출하세요. 모든 주요 브라우저와 호환되는 PNG 형식입니다.
캔버스 3D JS 라이브러리(C3DL)( http://www.c3dl.org/ )
C3DL을 사용하면 3D 프로그램 작성이 쉬워집니다. 깊은 3D 지식이 없어도 브라우저에서 직접 3D 콘텐츠를 개발할 수 있도록 일련의 수학, 장면 및 3D 개체 클래스를 제공합니다.
프로세싱.js( http://ejohn.org/blog/processingjs/ )
이는 처리 언어를 JavaScript로 포팅하는 것입니다. 2D 출력에는 기능이 풍부합니다. 그리기, 색상 처리, 글꼴, 개체 등에 대한 처리 기능을 제공합니다.
라파? 엘( http://raphaeljs.com/ )
웹에서 벡터 그래픽을 구현하기 위한 놀라운 JavaScript 라이브러리입니다. SVG를 사용하면 VML로 만든 그래픽을 변경하거나 이벤트를 바인딩할 수 있습니다. 회전, 애니메이션, 확대/축소 등 기능이 매우 풍부합니다.
ImageFX( http://www.nihilogic.dk/labs/imagefx/ )
이 JavaScript 라이브러리는 이미지에 흐림, 선명, 엠보싱, 하이라이트 등과 같은 효과를 추가합니다. ImageFX는 캔버스 개체를 사용하여 이러한 효과를 구현하며 모든 주요 브라우저와 호환됩니다. 이 라이브러리는 사용하기 매우 쉽습니다. .js 라이브러리 파일을 웹 페이지에 삽입하고 해당 기능을 호출하기만 하면 됩니다.
픽사스틱( http://www.pixastic.com/ )
Pixastic은 HTML5 캔버스 개체를 사용하여 원시 픽셀을 조작할 수 있습니다. 효과에는 채도 감소, 회색조, 반전, 밝기, 대비 조정, 색조, 채도 조정은 물론 릴리프, 흐림 및 기타 효과가 포함됩니다. HTML 5 캔버스 객체를 사용하기 때문에 아직 모든 브라우저와 호환되지는 않습니다.
Reflection.js( http://cow.neondragon.net/stuff/reflection/ )
매우 낮은 키의 JavaScript는 반사 효과를 자동으로 구현합니다. 반사의 높이와 투명도를 조정할 수 있습니다. 모든 주요 브라우저를 지원하며 파일 크기는 5K 미만입니다.
4. 데이터베이스
태피DB ( http://taffydb.com/ )
브라우저에서 SQL Server로 간주될 수 있는 JavaScript 라이브러리 또는 고급 배열 관리자입니다. AJAX를 사용하는 프로그램에서는 데이터 생성, 읽기, 편집, 삭제, 루프 사용, 정렬 및 고급 쿼리를 위한 데이터베이스 계층으로 사용될 수 있습니다.
ActiveRecord.js( http://www.activerecordjs.org/ )
이 라이브러리는 Google Gears는 물론 Chrome, Aptana Jaxer, Adobe AIR 및 HTML 5 SQL 사양(현재 Webkit 및 iPhone)을 지원하는 모든 플랫폼을 지원합니다. 테이블을 자동으로 생성하고 데이터를 검증하고 동기화할 수 있습니다.
