XMLHttpRequest, jQuery.ajax, jQuery.post, jQuery.get의 차이점은 무엇입니까?
상황에 가장 적합한 방법을 어떻게 알 수 있습니까? 기능과 성능의 차이를 아는 사람이 있습니까?
XMLHttpRequest
jQuery가보다 유용하고 단순화 된 형태로 통합되어 브라우저 간 일관성있는 기능을 제공하는 원시 브라우저 객체입니다.jQuery.ajax
jQuery의 일반적인 Ajax 요청자이며 모든 유형 및 컨텐츠 요청을 수행 할 수 있습니다.jQuery.get
그리고jQuery.post
다른 한편으로는 단지 GET 및 POST 요청을 발행 할 수 있습니다. 이것이 무엇인지 모른다면 HTTP 프로토콜을 확인 하고 조금 배워야합니다. 내부적으로이 두 함수는 사용jQuery.ajax
하지만 사용자가 설정할 필요가없는 특정 설정을 사용하므로을 사용하는 것과 비교하여 GET 또는 POST 요청을 단순화jQuery.ajax
합니다. GET 및 POST는 어쨌든 가장 많이 사용되는 HTTP 메소드입니다 (DELETE, PUT, HEAD 또는 다른 용도로는 거의 사용되지 않음).
모든 jQuery 함수 XMLHttpRequest
는 백그라운드에서 객체를 사용 하지만 사용자가 직접 수행 할 필요가없는 추가 기능을 제공합니다.
용법
따라서 jQuery를 사용하는 경우 jQuery 기능 만 사용하는 것이 좋습니다 . XMLHttpRequest
완전히 잊어 버리세요 . 적절한 jQuery 요청 함수 변형을 사용하고 다른 모든 경우에는 사용하십시오 $.ajax()
. 그래서 거기에 다른 잊지 않는 일반적인 jQuery를 아약스 관련 기능 으로는 $.get()
, $.post()
하고 $.ajax()
. $.ajax()
모든 요청에 사용할 수 있지만 조금 더 많은 코드를 작성해야합니다. 더 많은 옵션이 필요하기 때문입니다.
유추
마치 스티어링, 브레이크 등으로 자동차 전체를 만들어야하는 자동차 엔진을 직접 구매할 수있는 것처럼 보입니다. 자동차 제조업체는 친숙한 인터페이스 (페달, 스티어링 휠 등)로 완성 된 자동차를 생산합니다. 모든 것을 직접 할 필요는 없습니다.
그들 각각은 XMLHttpRequest를 사용합니다. 이것이 브라우저가 요청을하는 데 사용하는 것입니다. jQuery는 JavaScript 라이브러리 일 뿐이며 $ .ajax 메소드는 XMLHttpRequest를 만드는 데 사용됩니다.
$ .post 및 $ .get 은 간단한 축약 버전입니다 $.ajax
. 그들은 거의 똑같은 일을하지만 AJAX 요청을 더 빨리 작성합니다 $.post
-HTTP POST 요청을 $.get
만들고 HTTP GET 요청을합니다.
jQuery.get
에 대한 래퍼이며 jQuery.ajax
XMLHttpRequest에 대한 래퍼입니다.
XMLHttpRequest 및 Fetch API (현재 실험)는 DOM에서 유일하므로 DOM이 가장 빠릅니다.
더 이상 정확하지 않은 많은 정보를 보았으므로 언제든지 가장 좋은 버전의 버전을 테스트 할 수있는 테스트 페이지를 만들었습니다.
https://jsperf.com/xhr-vs-jquery-ajax-vs-get-vs-fetch
내 테스트에서 오늘 jQuery 만 깨끗하거나 빠른 솔루션이 아니라는 것을 보여줍니다. 모바일 또는 데스크톱에서 나에게 결과가 너무 많이 아약스를 사용하는 경우 jQuery가 XHR2보다 80 % 느리다는 것을 보여줍니다. 모바일에서는 간단한 사이트를로드하는 데 많은 시간이 걸립니다.
사용법 자체도 링크에 있습니다.
jQuery.post 및 jQuery.get은 일반적인 페이지로드를 시뮬레이트합니다. 즉, 제출 단추를 클릭하면 새 페이지로 이동하거나 동일한 페이지를 다시로드합니다. 게시하고 데이터가 서버로 전송되는 방식이 약간 다릅니다 (좋은 기사는 여기 에서 찾을 수 있습니다) .
jQuery.ajax 및 XMLHttpRequest는 페이지가 변경되지 않는다는 점을 제외하고 게시 및 가져 오기와 유사한 페이지로드입니다. 서버가 리턴하는 정보는 페이지 레이아웃 수정을 포함하여 어떤 방식 으로든 자바 스크립트에서 로컬로 사용될 수 있습니다. 일반적으로 사용자는 페이지를 탐색 할 수 있지만 비동기 작업을 수행하는 데 사용됩니다. 텍스트 필드를 완성하기 위해 데이터베이스 값에서 동적으로로드하는 자동 완성 기능이 이에 대한 좋은 예입니다. jQuery.ajax와 XMLHttpRequest의 근본적인 차이점은 jQuery.ajax는 XMLHttpRequest를 사용하여 동일한 효과를 가져 오지만 인터페이스는 더 단순하다는 것입니다. jQuery를 사용한다면 jQuery.ajax를 고수하는 것이 좋습니다.
오래된 게시물. 하지만 여전히 웹 작업자 와 작업하면서 직면 한 차이점 (자바 스크립트)
웹 작업자는 UI 수준의 액세스 권한을 가질 수 없습니다. 즉, 웹 워커를 사용하여 실행하려는 JavaScript 코드의 DOM 요소에 액세스 할 수 없습니다. 웹 워커 코드에서는 창, 문서 및 부모와 같은 개체에 액세스 할 수 없습니다.
우리가 알고 있듯이 jQuery 라이브러리는 HTML DOM에 연결되어 있으며, "DOM 액세스 없음"규칙을 위반할 수 있습니다. jQuery.ajax, jQuery.post, jQuery.get 과 같은 메소드 는 웹 워커에서 사용할 수 없기 때문에 약간 고통 스러울 수 있습니다 . 다행히 XMLHttpRequest 객체를 사용하여 Ajax 요청을 할 수 있습니다 .
마찬가지로 지금까지의 jQuery 방법은 이동로 .post
와 .get
간단하게 할 .ajax
내부적으로, 그 목적은 추상적으로 떨어져 일부 불필요한 옵션입니다 .ajax
일부 기본값은 각각 요청의 유형에 적합한 제공합니다.
나는 3의 성능 사이에 많은 차이가 있는지 의심합니다.
.ajax
자체 메소드는 XMLHttpRequest를, 그것은 크게 jQuery를의 나머지 부분에 따라 최적화 할 수 있습니다,하지만 당신은 전체의 상호 작용을 직접 맞는 것처럼 아마 효율적으로되지 않습니다 않습니다 ...하지만 코드를 작성 많은 나 사이의 차이점 쓰기 jQuery.ajax
.
'IT story' 카테고리의 다른 글
Java로 로그인하면 어떤 일이 발생합니까? (0) | 2020.07.22 |
---|---|
파일로 HTML5 레코드 오디오 (0) | 2020.07.22 |
고유 제한 조건의 이름 지정 규칙 (0) | 2020.07.22 |
차단 페이지 이탈 이벤트 (0) | 2020.07.22 |
JPA와 Hibernate에서 persist ()와 merge ()의 차이점은 무엇입니까? (0) | 2020.07.22 |