2018 년 12 월 6 일 :이 기사는 JavaScript 생태계의 현재 상태를 반영하도록 업데이트되었습니다. 올해의 업데이트는 Sencha가 후원합니다. Sitepoint를 가능하게 한 파트너를 지원해 주셔서 감사합니다!
이 기사는 가장 인기있는 클라이언트 측 프레임 워크, 라이브러리 및 도구 간의 기본 사항과 기본 차이점을 설명하는 것을 목표로합니다. 그들이 당신에게 적합한 지 여부는 또 다른 질문입니다. 하나를 선택하고 잠시 동안 고수하십시오. 선택한 것은 무엇이든 좋아하는 옵션이 더 나은 것으로 대체됩니다!
li.toc-h3 { 마진 왼쪽 : 20px; } li.toc-h4 { 마진 왼쪽 : 40px; } 핵심 포인트 <.> React는 효율적인 가상 DOM 및 구성 요소 기반 아키텍처 덕분에 사용자 인터페이스, 특히 단일 페이지 응용 프로그램을 구축하기위한 첫 번째 선택입니다.
Webpack과 Eslint는 모듈 번들링 및 코드 품질 보증에 각각 사용되는 최신 JavaScript 개발의 필수 도구로 강조됩니다.
- 카탈로그 카탈로그
- 거친 용어 도서관
- 프레임 도구 라벨을 표시하지 마십시오!
-
JavaScript 프레임 워크 및 라이브러리 jQuery 반응
-
Angular 2 (현재 7.x)
vue.js Sencha ext JS -
웹 팩
gulp.js npm
requirejs 도구 : 코드 스타일 점검
eslint-
jshint
-
도구 : 테스트 스위트 Jest
모카
Jasmine -
도구 : 기타 도구 - 주석
-
이 기사를 읽기 전에 다음 이용 약관을 수락하십시오! ... - "Best"에 의해 나는"가장 인기있는/중고/과장된 일반 프로젝트 "를 의미합니다. 모든 프로젝트에는 무료/오픈 소스 옵션이 있지만 목록에는 좋아하는 프로젝트가 포함되어 있지 않을 수 있습니다. 중지 된 품목 (예 : Yui)은 네트워크에서 여전히 매우 높지만 포함되지 않습니다.
-
클라이언트 프로젝트 만 참조하십시오. 서버 측에서 일부 는 작동하지만이 목록에는 Express.js 또는 Hapi와 같은 순수한 서버 측 프레임 워크가 포함되어 있지 않습니다. -
각 프로젝트에 대한 정보는 추가 연구에 대한 개요를 제공하기 위해 간략하게 고안되었습니다.
각 프로젝트는 사용 인기 지표를 제공하지만 통계는 정리하기가 어렵고 오도 할 수있는 것으로 잘 알려져 있습니다. -
나는 편견이있다. 당신도 편견이 있습니다. 다른 사람들도 편견이 있습니다! 나는 여기서 모든 도구를 시도하지 않았으며 내가 좋아하는 도구를 선언 할 것이지만, 당신은 당신의 요구에 따라 자신의 평가를해야합니다. sitepoint와 나는 당신이 내리는 비참한 결정에 책임이 없습니다! - 거친 용어
"프레임 워크", "라이브러리"및 "도구"라는 용어는 컨텍스트에 따라 다른 시간에 다른 사람들마다 다른 의미를 가질 수 있습니다. 여기에 사용 된 일반적인 정의 : 도서관
- 라이브러리는 일반적으로 더 높은 수준의 추상화를 제공하므로 구현 세부 사항과 불일치를 단순화합니다. 예를 들어 XMLHTTPREQUEST API를 사용하여 AJAX를 구현할 수 있지만 여러 줄의 코드가 필요하며 브라우저간에 약간의 차이가 있습니다. 라이브러리는 더 간단한 ajax () 기능을 제공 할 수 있으므로 더 높은 수준의 비즈니스 로직에 집중할 수 있습니다.
- 도서관의 오류는 찾아서 고치기가 어려울 수 있습니다
-
패치는 API를 변경하여 코드를 크게 변경할 수 있습니다.
JavaScript 환경은 매일 변경됩니다. 이 기사는 출판 된 순간 구식입니다! 라이브러리는 조직적이고 유용한 기능 모음입니다. 일반적인 라이브러리에는 문자열, 날짜, HTML 돔 요소, 이벤트, 쿠키, 애니메이션, 네트워크 요청 등을 처리하는 기능이 포함될 수 있습니다. 각 함수는 값을 호출 응용 프로그램에 반환하며 선택에 따라 구현할 수 있습니다. 일련의 자동차 부품으로 생각하십시오. 제대로 운전할 수있는 자동차를 만들기 위해 모든 구성 요소를 사용하여 엔진을 직접 구축해야합니다. 도서관은 세부 사항에 대해 걱정할 필요가 없기 때문에 개발 시간을 20% 줄일 수 있습니다. 단점 : 개발 팀은 패치가 빠르게 릴리스 될 것이라고 보장 할 수 없습니다 프레임
프레임 워크는 응용 프로그램의 골격입니다. 특정 방식으로 소프트웨어 디자인을 처리하고 특정 지점에서 자신의 논리를 삽입해야합니다. 일반적으로 이벤트, 스토리지 및 데이터 바인딩과 같은 기능을 제공합니다. 자동차의 비유를 사용하여 프레임은 작동하는 섀시, 본문 및 엔진을 제공합니다. 차량이 여전히 작동중인 경우 특정 구성 요소를 추가, 제거 또는 조정할 수 있습니다. 프레임 워크는 일반적으로 라이브러리보다 더 높은 수준의 추상화를 제공하며 프로젝트의 첫 80%를 빠르게 구축하는 데 도움이 될 수 있습니다. 단점 :응용 프로그램이 프레임 워크의 범위를 벗어난 경우 마지막 20%가 어려울 수 있습니다. 프레임 업데이트 또는 마이그레이션이 어려울 수 있습니다 핵심 프레임 워크 코드 및 개념은 시간에 거의 적응하지 않습니다. 개발자는 항상 같은 일을하는 더 좋은 방법을 찾을 것입니다. 도구
- 도구는 더 간단한 개발 프로세스를 제공해야합니다. 예를 들어, 많은 프로그래머는 코드 분리, 중첩, 시간 변수, 루프 및 기능을 제공하기 때문에 CSS보다 SASS를 선호합니다. 브라우저는 SASS/SCSS 구문을 이해하지 못하므로 테스트 및 배포 전에 적절한 도구를 사용하여 코드를 CSS로 컴파일해야합니다. 라벨을 표시하지 마십시오!
-
라이브러리, 프레임 워크 및 도구의 차이점은 거의 명확하지 않습니다. 프레임 워크에는 라이브러리가 포함될 수 있습니다. 라이브러리는 프레임 워크와 같은 방법을 구현할 수 있습니다. 도구는 두 가지 모두에게 중요 할 수 있습니다. 각 항목을 표시하려고 시도했지만 범위는 다를 수 있습니다. 이것이 너무 복잡하게 들리면 기본 JavaScript를 작성하는 것을 고려할 수 있습니다. 이것은 훌륭하지만 유지 해야하는 자신의 라이브러리 및/또는 프레임 워크 코드를 작성하게됩니다. JavaScript 자체는 브라우저 및 운영 체제 추상화 위의 추상화입니다! JavaScript 프레임 워크 및 라이브러리 대략적인 사용 순서/인기/과대 광고로 배열 된 항목 jQuery
jQuery
설명
도서관 웹 사이트 jquery.com repository github. com/jquery/jquery github stars 50,000 현재 버전 3.3.1 개발자 jQuery 팀 출시 날짜 2006 년 8 월 전형적인 크기 30KB MIN 전형적인 사용 보편적 사용 보편적 사용 모든 웹 사이트의 73.5% jQuery는 가장 널리 사용되는 JavaScript 라이브러리로 남아 있으며 ASP ASP와 함께 배포됩니다. .NET 및 기타 프레임 워크. CSS 선택기를 DOM 노드 검색에 소개하고 이벤트 처리기, 애니메이션 및 AJAX 통화를 적용하기 위해 링크하여 클라이언트 개발에 혁명을 일으킨다.
최근 몇 년 동안 jQuery는 개발자와 점차 인기가 없지만 사용률은 여전히 높습니다. 소량의 JavaScript 기능이 필요한 프로젝트에는 여전히 실용적인 옵션입니다.프로 :
분포 크기
간단한 문법
. 가장 인기있는 버전은 여전히 버전 1.X이며, 이는 DOM 작업을 응용 프로그램 로직으로부터 분리하면서 양방향 데이터 바인딩을 통해 HTML을 확장합니다. 에서 업그레이드 할 수 없습니다
1.x와 비교하여 각도 2.x 채택률은 상대적으로 낮습니다
Google 프로젝트이지만 Google은 사용하지 않는 것 같습니다.
explion
explion 프로 :
gulp.js 도구 : 모듈 Bundler
eslint 웹 사이트 eslint.org repository github.com/ Eslint/Eslint Github Stars 12,000 현재 버전 5.9.0 주당 4 백만 다운로드 Eslint는 대부분의 IDES, 편집자, 번들러 및 작업 주자가 지원하는 가장 인기있는 코드 스타일 확인 도구입니다. 각 규칙은 플러그인이므로 선호도에 따라 구성 할 수 있습니다.
네이티브 API 의 속도 오버 헤드를 추가하십시오
프로 :
Angularjs 1.x
웹 사이트 웹 사이트 angularjs.org 리포지토리 github .
프로 :
현대 웹 애플리케이션 생성을위한 단일 솔루션
유형 프레임 워크 웹 사이트 vuejs.org 리포지토리 github.com/vuejs/vue github Stars 120,000 현재 버전 2.5.17 개발자 Evan 2014 년 2 월 2 월 릴리스 날짜 일반 19KB 최소 일반적인 목적 구성 요소 및 단일 페이지 애플리케이션 낮은 사용량 vue.js는 사용자 인터페이스를위한 가벼운 진보적 인 프레임 워크입니다. 코어는 다른 라이브러리와 통합 될 수있는 반응과 같은 가상 DOM 구동 뷰 레이어를 제공하지만 단일 페이지 응용 프로그램을 구동 할 수 있습니다. 프레임 워크는 이전에 AngularJS에서 일했지만 그가 좋아하는 부분을 추출하고 싶었던 Evan You에 의해 만들어졌습니다.
프로 :
LIBRASION WABSEDASH.com/ Repository github .com/lodash/lodash/github Stars 35,000 현재 버전 4.17.11 개발자 John-David Dalton 출시 날짜 2012 년 4 월 일반 크기 4KB-24KB 최소 사용 일반적인 사용 저조용 사용
설명
유형 라이브러리 웹 사이트 indercorejs.org/ repository github.com/jashkenas/underscore github 스타 24,000 현재 버전 1.8 출시 날짜 2009 년 10 월 일반 크기 6KB 최소 사용 일반적인 사용 저조용 저용량이 섹션은 수백 개의 기능적 자바 스크립트 유틸리티를 제공하여 기본 문자 문자열, 숫자, 배열 및 기타 원시 객체 방법을 보충하기 위해 수백 개의 기능적 자바 스크립트 유틸리티를 제공하므로 밑줄을 결합합니다. 일부 중복이 있으므로 한 프로젝트에 두 라이브러리가 모두 필요할 가능성은 낮습니다.
Framework 웹 사이트 backbonejs.org 리포지토리를 입력하십시오 github.com/jashkenas/backbone/ github Stars 37,000 현재 버전 1.3.3 개발자 Jeremy Ashkenas 출시 날짜 2010 년 10 월 전형적인 크기 8KB 최소 단일 페이지 애플리케이션 낮은 사용법 백본. MVC 구조에 대한 클라이언트 옵션. 유일한 종속성은 alterscore.js이며 동일한 개발자가 생성합니다.
<.> backbone.js는 다른 프로젝트와 통합 될 수 있기 때문에 도서관이라고 주장합니다. 나는 대부분의 개발자들이 프레임 워크라고 생각하지만 다른 개발자만큼 자의적이지는 않지만 프레임 워크라고 생각합니다.
프로 :
유형 프레임 워크 웹 사이트 emberjs.com 저장소 github.com/emberjs/ember.js github Stars 20,000 현재 버전 3.6.0 개발자 Ember 팀 출시 날짜 2011 년 12 월 일반 크기 95KB 최소 사용 단일 페이지 응용 프로그램 저지대 ember.js는 모델 -View-View를 기반으로합니다. 모델 (MVVM) 모델의 더 큰 임의의 프레임 워크. 템플릿, 데이터 바인딩 및 라이브러리를 하나의 패키지로 구현합니다. Ruby on Rails에 대한 경험이있는 사람들에게는 구성에 대한 컨벤션 개념이 즉시 친숙합니다.
knockout.js
설명 프레임 워크 웹 사이트 knockoutjs.com 리포지토리를 입력하십시오 github.com/knockout/knockout 스타 9,000 현재 버전 3.5.0 개발자 Steve Sanderson 출시 날짜 2010 년 7 월 2010 년 7 월 일반 크기 59KB 최소 단일 페이지 애플리케이션 낮은 사용법 녹아웃 .JS는 이전 MVVM 프레임 워크 중 하나입니다. UI는 기본 데이터와 동기화되어 있습니다. 템플릿 및 종속성 추적 기능이 있습니다.
도구 : 일반 작업 러너
npm
description grunt description
웹 사이트 gruntjs.com repository github.com/ Gruntjs/Grunt Github Stars 17,000 현재 버전 1.0.3 주당 다운로드 425,000 Grunt는 대규모 채택을 구현 한 최초의 JavaScript 작업 러너 중 하나 였지만 속도와 복잡한 JSON 구성으로 인해 GULP가 증가했습니다. 최악의 문제는 해결되었고 Grunt는 여전히 인기있는 선택입니다.
requirejs
문법 표준과의 잠재적 오류 또는 편차에 대한 코드를 분석하십시오. 가까운 괄호 나 고교되지 않은 변수를 놓치지 않을 것입니다!
eslint
explice
jshint
웹 사이트 jshint.com repository github.com/ JSHINT/JSHINT GITHUB 스타 8,000 현재 버전 2.9.6 주당 390,000 ESLINT만큼 구성 할 수없는 유연한 JavaScript 코드 스타일 검사기는 실제 버그와 강성 구문 요구 사항 사이의 균형을 잘 맞습니다.
AVA, 테이프 및 재스민을 포함한 많은 옵션이 있지만 가장 인기있는 세 가지 옵션은 ... Jest
jasmine
Svelte 및 Rawact와 같은 새로운 번역기 옵션은 위험을 감수하려면 프레임 워크 코드를 기본 JavaScript로 변환합니다. 프레임 워크 종속성이 제거되었고 코드는 더 작고 더 빠르게 실행됩니다.
즉, 각 프로젝트, 팀 및 기술 세트는 다릅니다. 평가 시간이 제한되어 있으므로 알고있는 것을 사용하고 싶은 유혹이 있습니다. 이 게시물은 추천
frameworkx를 권장하는 댓글을 받게되지만 망치가 있으면 모든 것이 못처럼 보입니다.
선택적이라는 것을 잊지 마십시오!
중합체는 웹 구성 요소를 구축하기 위해 Google이 개발 한 라이브러리입니다. 사용자 정의 HTML 요소를 작성하고 이러한 요소에서 CSS 및 JavaScript를 캡슐화하고 데이터 바인딩 및 이벤트 처리를 사용하는 기능 세트를 제공합니다. 중합체는 또한 일원 및 양방향 데이터 결합을지지한다.
위 내용은 2019 년 최고의 자바 스크립트 프레임 워크, 라이브러리 및 도구의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

JavaScript는 브라우저 및 Node.js 환경에서 실행되며 JavaScript 엔진을 사용하여 코드를 구문 분석하고 실행합니다. 1) 구문 분석 단계에서 초록 구문 트리 (AST)를 생성합니다. 2) 컴파일 단계에서 AST를 바이트 코드 또는 기계 코드로 변환합니다. 3) 실행 단계에서 컴파일 된 코드를 실행하십시오.

Python 및 JavaScript의 미래 추세에는 다음이 포함됩니다. 1. Python은 과학 컴퓨팅 분야에서의 위치를 통합하고 AI, 2. JavaScript는 웹 기술의 개발을 촉진하고, 3. 교차 플랫폼 개발이 핫한 주제가되고 4. 성능 최적화가 중점을 둘 것입니다. 둘 다 해당 분야에서 응용 프로그램 시나리오를 계속 확장하고 성능이 더 많은 혁신을 일으킬 것입니다.

개발 환경에서 Python과 JavaScript의 선택이 모두 중요합니다. 1) Python의 개발 환경에는 Pycharm, Jupyternotebook 및 Anaconda가 포함되어 있으며 데이터 과학 및 빠른 프로토 타이핑에 적합합니다. 2) JavaScript의 개발 환경에는 Node.js, VScode 및 Webpack이 포함되어 있으며 프론트 엔드 및 백엔드 개발에 적합합니다. 프로젝트 요구에 따라 올바른 도구를 선택하면 개발 효율성과 프로젝트 성공률이 향상 될 수 있습니다.

예, JavaScript의 엔진 코어는 C로 작성되었습니다. 1) C 언어는 효율적인 성능과 기본 제어를 제공하며, 이는 JavaScript 엔진 개발에 적합합니다. 2) V8 엔진을 예를 들어, 핵심은 C로 작성되며 C의 효율성 및 객체 지향적 특성을 결합하여 C로 작성됩니다.

JavaScript는 웹 페이지의 상호 작용과 역학을 향상시키기 때문에 현대 웹 사이트의 핵심입니다. 1) 페이지를 새로 고치지 않고 콘텐츠를 변경할 수 있습니다. 2) Domapi를 통해 웹 페이지 조작, 3) 애니메이션 및 드래그 앤 드롭과 같은 복잡한 대화식 효과를 지원합니다. 4) 성능 및 모범 사례를 최적화하여 사용자 경험을 향상시킵니다.

C 및 JavaScript는 WebAssembly를 통한 상호 운용성을 달성합니다. 1) C 코드는 WebAssembly 모듈로 컴파일되어 컴퓨팅 전력을 향상시키기 위해 JavaScript 환경에 도입됩니다. 2) 게임 개발에서 C는 물리 엔진 및 그래픽 렌더링을 처리하며 JavaScript는 게임 로직 및 사용자 인터페이스를 담당합니다.

JavaScript는 웹 사이트, 모바일 응용 프로그램, 데스크탑 응용 프로그램 및 서버 측 프로그래밍에서 널리 사용됩니다. 1) 웹 사이트 개발에서 JavaScript는 HTML 및 CSS와 함께 DOM을 운영하여 동적 효과를 달성하고 jQuery 및 React와 같은 프레임 워크를 지원합니다. 2) 반응 및 이온 성을 통해 JavaScript는 크로스 플랫폼 모바일 애플리케이션을 개발하는 데 사용됩니다. 3) 전자 프레임 워크를 사용하면 JavaScript가 데스크탑 애플리케이션을 구축 할 수 있습니다. 4) node.js는 JavaScript가 서버 측에서 실행되도록하고 동시 요청이 높은 높은 요청을 지원합니다.

Python은 데이터 과학 및 자동화에 더 적합한 반면 JavaScript는 프론트 엔드 및 풀 스택 개발에 더 적합합니다. 1. Python은 데이터 처리 및 모델링을 위해 Numpy 및 Pandas와 같은 라이브러리를 사용하여 데이터 과학 및 기계 학습에서 잘 수행됩니다. 2. 파이썬은 간결하고 자동화 및 스크립팅이 효율적입니다. 3. JavaScript는 프론트 엔드 개발에 없어서는 안될 것이며 동적 웹 페이지 및 단일 페이지 응용 프로그램을 구축하는 데 사용됩니다. 4. JavaScript는 Node.js를 통해 백엔드 개발에 역할을하며 전체 스택 개발을 지원합니다.


핫 AI 도구

Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool
무료로 이미지를 벗다

Clothoff.io
AI 옷 제거제

Video Face Swap
완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

인기 기사

뜨거운 도구

PhpStorm 맥 버전
최신(2018.2.1) 전문 PHP 통합 개발 도구

VSCode Windows 64비트 다운로드
Microsoft에서 출시한 강력한 무료 IDE 편집기

SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)

맨티스BT
Mantis는 제품 결함 추적을 돕기 위해 설계된 배포하기 쉬운 웹 기반 결함 추적 도구입니다. PHP, MySQL 및 웹 서버가 필요합니다. 데모 및 호스팅 서비스를 확인해 보세요.

드림위버 CS6
시각적 웹 개발 도구
