[JQUERY] 때 jQuery를 대 바닐라 자바 ​​스크립트를 사용 하는가?

때 jQuery를 대 바닐라 자바 ​​스크립트를 사용 하는가?

해결법

1. ---

   1.... 난 당신이 생각을 생각합니다.

   ... 난 당신이 생각을 생각합니다.

   성능이 중요한 경우가있을 것입니다. 여러 번에 걸쳐 루프에서 뭔가를 수행하는 경우처럼, 당신은 jQuery를 도랑 할 수 있습니다.

   일반적으로 당신은 대체 할 수있다 :

   $(el).attr('someName');
   

   와:

2. ---

   2.정답은 항상 대신 '평범한 구식'네이티브 자바 스크립트의 jQuery를 사용하는 경우 성능 저하를 취할 것이라는 점이다. jQuery를이 자바 스크립트 라이브러리이기 때문이다. 그것은 자바 스크립트의 일부 공상 새로운 버전이 아닙니다.

   정답은 항상 대신 '평범한 구식'네이티브 자바 스크립트의 jQuery를 사용하는 경우 성능 저하를 취할 것이라는 점이다. jQuery를이 자바 스크립트 라이브러리이기 때문이다. 그것은 자바 스크립트의 일부 공상 새로운 버전이 아닙니다.

   jQuery를이 강력한 이유는 그것이 가능한 브라우저의 무수한 사이의 불일치를 통해 일부 크로스 브라우저 상황에서 지나치게 지루한 것들 (AJAX는 최고의 사례 중 하나입니다)이 부드럽게을하고 일관성있는 API를 제공한다는 것입니다. 또한 쉽게 함께 요소의 그룹 작업을 단순화하는 등 체인, 묵시적 반복, 같은 개념을 용이하게합니다.

   학습 jQuery를 자바 스크립트 학습을 대신 할 수 없습니다. 당신은 당신이 완전히 당신을 위해 쉽게 만드는 전자를 아는 것을 감사하는 후자 그래서에서 확고한 기반을 가져야한다.

   - 편집 포괄 댓글 -

   코멘트는 지적 재빨리 (나는 100 % 동의)와 같은 문장은 위의 코드를 벤치마킹를 참조하십시오. A '기본'자바 스크립트 솔루션 거의 모든 경우에 같은 일을 수행 JQuery와 솔루션을 능가한다 (이 잘 작성된 것입니다 가정) (I 그렇지 않으면 예를보고 싶어요). jQuery를 내가 경시 의미하지 않는다 큰 혜택입니다 개발 시간, 최대 속도를 않습니다. 그것은 어떤 개발자가 독자적으로 생성 할 수있는보다 더 인 코드를 따라, 읽기 쉬운 쉽고 용이하게합니다.

   다음 제 생각에는, 대답은 당신이 달성하려고하는지에 따라 달라집니다. 내가 성능상의 이점에 대한 참조를 기반으로 추정대로, 당신이 당신의 응용 프로그램에서 최고의 속도 후 경우, 다음 오버 헤드 당신이 $ 호출 할 때마다 ()의 jQuery 소개합니다을 사용. 당신이 가독성, 일관성, 크로스 브라우저 호환성 등을 위해가는 경우, 다음 확실히 '기본'자바 스크립트를 통해 jQuery를 선호하는 이유가 있습니다.

3. ---

   3.프레임 워크가있다라고 ... 아 어떻게 됐을까? 바닐라 JS. 당신이 ID로 DOM 요소를 가져 오는 중 거의 35 배 빠르다는 것을 알 수 노호 성능을위한 D 그것은 희생 코드의 가독성 ... jQuery를에 비교 : 당신이 농담을 ... 얻을 바랍니다. :)

   프레임 워크가있다라고 ... 아 어떻게 됐을까? 바닐라 JS. 당신이 ID로 DOM 요소를 가져 오는 중 거의 35 배 빠르다는 것을 알 수 노호 성능을위한 D 그것은 희생 코드의 가독성 ... jQuery를에 비교 : 당신이 농담을 ... 얻을 바랍니다. :)

   성능을 원한다면 당신은 더 나은 바닐라 JS를 시도하고 자신의 결론을 내릴 것입니다. 어쩌면 당신은 자바 스크립트 / 브라우저의 GUI 매달려 루프의 내부와 같은 집중적 인 코드 동안 UI 스레드를 잠금 발생하지 않습니다.

   홈페이지에 일부 반환 한 비교를있다 :

4. ---

   4.거기에 허용 대답은 이미하지만 바로 여기에 입력 한 아무 대답이 실질적으로 크로스 브라우저 지원을 보장 한 기본 자바 스크립트 방법 / 속성의 목록에서 포괄적 수 없다 생각합니다. 이를 위해 나는 쿼크 모드로 리디렉션 할 수 있습니다 :

   거기에 허용 대답은 이미하지만 바로 여기에 입력 한 아무 대답이 실질적으로 크로스 브라우저 지원을 보장 한 기본 자바 스크립트 방법 / 속성의 목록에서 포괄적 수 없다 생각합니다. 이를 위해 나는 쿼크 모드로 리디렉션 할 수 있습니다 :

   http://www.quirksmode.org/compatibility.html

   그것은 아마도 어떤 작품의 가장 포괄적 인 목록입니다 어떤 브라우저 어느 곳에서 일을하지 않는 것. DOM을 섹션에 특히주의를 기울이십시오. 읽을 수 많은하지만 포인트는 모두 읽어하지만, 참조로 사용하지 않는 것입니다.

   나는 진지하게 시작했을 때 웹을 작성하는 것은 내가 모든 DOM 테이블을 인쇄하고 내가 사용하는 것이 안전하고 어떤 해킹을 필요로 한 눈에 알 수 있도록 벽에 그들을 걸어 애플 리케이션. 내가 의심이있을 때 요즘은 그냥 쿼크 모드의 인 parentNode 호환성 같은 구글.

   다른 것 같이, 판단은 대부분 경험의 문제이다. 정말 사이트 전체를 읽을 때 일반 JS를 사용하는 jQuery를 등을 사용하는 경우 알아 내기 위해 모든 문제를 암기하도록 권하고 싶지 않다. 그냥 목록에 유의하십시오. 그것은 검색 할 쉽게 충분하다. 시간 사용하면 일반 JS 바람직하다 때의 본능을 개발할 것입니다.

   PS : PPK (사이트의 저자)도 내가 읽기를 권장 않는 것이 아주 좋은 책이있다

5. ---

   5.언제:

   언제:

   자바 스크립트를 사용합니다. 그렇지 않으면 jQuery를 (당신이 할 수있는 경우)를 사용합니다.

   편집 : 그것을 밖으로 떠나는 대 전체 jQuery를 사용하여 선택뿐만 아니라 jQuery를 내부 바닐라 JS를 사용할지 여부를 선택할 때이 답변이 모두 적용됩니다. , ATTR ( 'ID')와 JS 찬성 .ID 몸을 숙 중에서 선택 .ClassName과 = .className.replace 대 removeClass ( 'foo는') 사이에 (새 정규 표현식을 (선택하면서 "(? : ^ | \\ S +)"+ foo는 + : |, 'g'), jQuery를 찬성 '') 몸을 숙 "(\\의 + $?)".

6. ---

   6.기타 '응답은의 다양한 문제에 초점을 맞추고있다 "일반 JS 대 jQuery를." 당신의 영업 이익으로 판단, 나는 이미 jQuery를 사용하도록 선택한 경우 바닐라 JS를 사용하는 것이 좋습니다 때 당신은 단순히 궁금했다 생각합니다. 귀하의 예는 바닐라 JS을 사용해야 할 때의 완벽한 예입니다 :

   기타 '응답은의 다양한 문제에 초점을 맞추고있다 "일반 JS 대 jQuery를." 당신의 영업 이익으로 판단, 나는 이미 jQuery를 사용하도록 선택한 경우 바닐라 JS를 사용하는 것이 좋습니다 때 당신은 단순히 궁금했다 생각합니다. 귀하의 예는 바닐라 JS을 사용해야 할 때의 완벽한 예입니다 :

   $ (이) .attr ( 'ID');

   모두 느린 (내 생각에) 덜 읽을 수보다 :

   this.id.

   당신은 단지 속성을 JQuery와 방법을 검색 할 객체 새로운 JS를 회전해야하기 때문에이 느리다. 당신은 $를 사용하는 거라면 이제 (이)의 jQuery 변수에 객체와 그와 함께 작동하는지, 부디 다음, 저장, 다른 작업을 수행 할 수 있습니다. 그러나, 나는 그냥 (ID 또는 SRC 같은) 요소에서 속성이 필요한 많은 상황으로 실행했습니다.

   나는 가장 일반적인 경우는 당신이 게시물에 설명하는 하나라고 생각; 불필요하게 jQuery를 객체에 $ (이) 포장 사람들. 내가 (대신 $ (이)를 사용하여 .val ()) ID와 값이 가장 자주를 참조하십시오.

   편집 : 다음은 느린 ATTR () 경우에 jQuery를 사용하는 이유를 설명 기사입니다. 고백 : 태그 위키에서 훔친,하지만 난 그것의 가치는 질문에 대해 언급 생각합니다.

   다시 편집 : 직접 단지에 접속 속성의 가독성 / 성능에 영향을 감안할 때, 나는 엄지 손가락의 좋은 규칙이를 사용하려고 아마라고 말하고 싶지만 <에 attributename> 가능한 경우.. 이 것 때문이 아니라 브라우저 불일치의 작동하지만 아마 더 나은이 먼저 시도하고 그 일을하지 않는 경우 jQuery를 다시 가을에 어떤 경우는 아마이 있습니다.

7. ---

   7.당신은 주로 성능에 대해 우려하는 경우, 주 예는 머리에 못을 안타. 호출 jQuery를 불필요하거나 중복 이럴, 성능 저하의 주요 원인 제 (제 인 불량한 DOM 통과)하다.

   당신은 주로 성능에 대해 우려하는 경우, 주 예는 머리에 못을 안타. 호출 jQuery를 불필요하거나 중복 이럴, 성능 저하의 주요 원인 제 (제 인 불량한 DOM 통과)하다.

   정말 당신이 찾고있는 무엇의 예 아니지만, 그래서 종종 언급 곰 것을이 참조 : 캐시 jQuery를이 객체에 jQuery를 스크립트의 성능을 향상하는 가장 좋은 방법 중 하나는, 및 / 또는 사용은 체인 :

   // poor
   $(this).animate({'opacity':'0'}, function() { $(this).remove(); });
   
   // excellent
   var element = $(this);
   element.animate({'opacity':'0'}, function() { element.remove(); });
   
   // poor
   $('.something').load('url');
   $('.something').show();
   
   // excellent
   var something = $('#container').children('p.something');
   something.load('url').show();
   

8. ---

   8.나는 중복 JS와 JQ 사이에 확실히이 발견했습니다. 당신이 보여준 코드는 그 좋은 예입니다. 솔직히, JS를 통해 JQ를 사용하는 가장 좋은 이유는 단순히 브라우저 호환성이다. 난 항상 JS에서 뭔가를 달성 할 수있는 경우에도, JQ으로 의지.

   나는 중복 JS와 JQ 사이에 확실히이 발견했습니다. 당신이 보여준 코드는 그 좋은 예입니다. 솔직히, JS를 통해 JQ를 사용하는 가장 좋은 이유는 단순히 브라우저 호환성이다. 난 항상 JS에서 뭔가를 달성 할 수있는 경우에도, JQ으로 의지.

9. ---

   9.이것은 나의 개인적인 견해이지만, jQuery를 어쨌든 자바 스크립트이기 때문에, 나는 그 어느 바닐라 JS보다 더 수행 할 수 없습니다 이론적으로 생각합니다.

   이것은 나의 개인적인 견해이지만, jQuery를 어쨌든 자바 스크립트이기 때문에, 나는 그 어느 바닐라 JS보다 더 수행 할 수 없습니다 이론적으로 생각합니다.

   사람의 손으로 쓴 코드가 될하지 jQuery를 효율적 할 수있다 그러나 실제적으로는, 손으로 쓴 JS보다 더 잘 수행 할 수있다.

   하단 라인 - 그것은 또한 더 생산적입니다 - 작은 물건 나는 바퀴를 재발견 jQuery를 사용하지하고자 JS 집약적 인 프로젝트 바닐라 JS를 사용하는 경향이있다.

10. ---

    10.DOM 요소로 이것의 첫 번째 대답의 라이브 속성 목록은 아주 완료됩니다.

    DOM 요소로 이것의 첫 번째 대답의 라이브 속성 목록은 아주 완료됩니다.

    당신은 어떤 다른 사람을 아는 것도 흥미로운 찾을 수 있습니다.

    때이 문서는 다음과 같습니다

    당신이하는 경우 - document.forms 작업 할 때 예 : document.forms [formNameOrId]는 그렇게 이름 또는 확인 양식을 가져옵니다.

    때이 양식은 다음과 같습니다

    때 양식 필드는 다음과 같습니다

    의 jQuery 셀렉터를 학습 할 때, 우리는 종종 이미 액세스 너무 빨리 기존의 HTML 요소의 특성을 학습 건너 뜁니다.

11. ---

    11.평소와 같이 나는이 파티에 늦게오고있다.

    평소와 같이 나는이 파티에 늦게오고있다.

    그것은 그였다 나를 매력적으로, jQuery를 사용하기로 결정 만든 추가 기능 아니었다. 아무 것도 후 자신의 함수를 작성에서 당신을 중지합니다.

    메모리 누수를 방지하기 위해 DOM (나는 당신에 대해 IE를 말하는거야) 수정할 때 배울 수있는 많은 트릭이 있었다는 사실이었다. 지속적으로 검토, 수정 및 테스트되고 있었다 훨씬 더 나은 내가 할 수있는 것보다 JS 코더했다 사람에 의해 쓰여진 나를 위해 문제의 모든 종류를 관리하는 하나의 중앙 자원이 하나님 보내기이었다.

    나는 크로스 브라우저 지원 / 추상화 인수에 해당 이런 종류의 같아요.

    당신이 그것을 필요로 할 때 물론 jQuery를 바로 JS의 사용을 배제하지 않는다. 난 항상이 원활하게 협력 할 것 같았다 느꼈다.

    물론 브라우저는 jQuery를 지원하지 않습니다 또는 당신은 로우 엔드 환경 (오래된 전화?)를 큰의 .js 파일이 문제가 될 수를 지원하는 경우. jQuery를이 작은 것으로 사용할 때 기억 나?

    그러나 일반적으로 성능 차이는 우려의 문제가되지 않습니다. 그것은 단지 빠른 충분합니다. 매 순간을 낭비가는 CPU 사이클 기가 헤르츠로, 나는 더 내 코더, 18 개월마다 전력을 두 번하지 않는 유일한 개발 자원의 성능에 관심 있어요.

    그게 내가 현재 접근성 문제를 조사하지있어 분명히 .innerHTML는 약간의 그 어떠한 '노 말했다. 물론 jQuery를 그래서 지금은 허용되는 다소 지루한 방법에 따라 달라집니다 프레임 워크를 찾고 있어요, .innerHTML에 따라 달라집니다. 그리고 나는 그런 프레임 워크가 느린 jQuery를보다 실행됩니다 상상할 수 있지만 한이 충분히 잘 수행으로, 나는 알 수있을 것입니다.

12. ---

    12.다음은 비 기술적 인 해답입니다 - 많은 작업은 jQuery와 같은 특정 라이브러리를 허용하지 않을 수 있습니다.

    다음은 비 기술적 인 해답입니다 - 많은 작업은 jQuery와 같은 특정 라이브러리를 허용하지 않을 수 있습니다.

    사실 그것은에 아닙니다, 사실, 구글은 코드의에서 jQuery를 허용하지 않습니다 (도이 페이스 북에 의해 소유하고 있기 때문에, 반작용) 면접관 죄송합니다 '라는 메시지가 표시 될 때까지 당신이 알고하지 않을 수 있습니다,하지만 당신은 jQuery를 사용하지 못할 XYZ 회사에서 승인 된 목록 ". 바닐라 자바 ​​스크립트는 절대적으로 모든 곳마다 작동, 당신에게이 문제를 포기하지 않을 것입니다. 당신이 라이브러리 예에 의존하는 경우에 당신은 속도와 편의성을 얻을 수 있지만, 보편성을 잃게됩니다.

    또한, 인터뷰의 말하기, 다른 단점은 당신이 코드 퀴즈 동안 자바 스크립트 문제를 해결하기 위해 라이브러리를 사용할 필요가 말한다면, 그것은 당신이 실제로 좀 나쁜 보이는 문제를 이해하지 못하는처럼 건너 오는 것입니다. 당신은 원시 바닐라 자바 ​​스크립트에서 그것을 해결하면 반면에 당신이 실제로 이해하고 그들이 당신 앞에 던져 어떤 문제의 모든 부분을 해결할 수 있음을 보여줍니다.

13. ---

    13.(이) 여기에 다른 $ :

    (이) 여기에 다른 $ :

    $를 사용하여 (이) 당신은 jQuery를 프로토 타입 객체에 전달되는 보장된다.

from https://stackoverflow.com/questions/4651923/when-to-use-vanilla-javascript-vs-jquery by cc-by-sa and MIT license