Mustache.js와 Handlebars.js의 차이점은 무엇입니까?

내가 본 주요 차이점은 다음과 같습니다.

• 핸들 추가 #if, #unless, #with, 및#each
• 핸들 바로 헬퍼 추가
• 핸들 바 템플릿이 컴파일 됨 (콧수염도 가능)
• 핸들 바는 경로를 지원 합니다
• {{this}}in 블록 사용 가능 (현재 항목의 문자열 값을 출력 함)
• Handlebars.SafeString() (그리고 아마도 다른 방법들)
• 핸들 바가 2-7 배 빠릅니다
• 콧수염 지원 반전 섹션 (예 if !x ...)

(위의 내용이 틀리면 수정 해주세요.)

내가 놓친 다른 주요 차이점이 있습니까?

당신은 거의 그것을 못 박았지만 콧수염 템플릿도 컴파일 할 수 있습니다.

콧수염에는 도우미가 없으며 고급 블록은 논리가 없기 때문에 노력합니다. 핸들 바의 커스텀 헬퍼는 매우 유용하지만 종종 템플릿에 로직을 도입하게됩니다.

콧수염에는 많은 다른 컴파일러 (JavaScript, Ruby, Python, C 등)가 있습니다. 핸들 바는 JavaScript로 시작되었으므로 이제 django-handlebars , handlebars.java , handlebars-ruby , lightncandy (PHP) 및 handlebars-objc 와 같은 프로젝트가 있습니다 .

콧수염 전문가 :

• 대규모의 활발한 커뮤니티에서 매우 인기있는 선택입니다.
• Java를 포함한 여러 언어로 서버 측 지원
• 로직리스 템플릿은 프리젠 테이션을 로직과 분리하는 데 큰 도움이됩니다.
• 깔끔한 구문은 작성, 읽기 및 유지 관리가 쉬운 템플릿으로 이어집니다.

콧수염 단점 :

• 약간 논리가 적습니다. 기본 작업 (예 : 다른 CSS 클래스로 대체 행 레이블 지정)은 어렵습니다.
• 뷰 로직은 종종 서버로 푸시되거나 "lambda"(호출 가능한 함수)로 구현됩니다.
• 람다는 클라이언트와 서버에서 작동하려면 JavaScript로 작성해야합니다.

핸들 바 전문가 :

• 로직리스 템플릿은 프리젠 테이션을 로직과 분리하는 데 큰 도움이됩니다.
• 깔끔한 구문은 작성, 읽기 및 유지 관리가 쉬운 템플릿으로 이어집니다.
• 해석 된 템플릿이 아니라 컴파일됩니다.
• 콧수염보다 경로를 더 잘 지원합니다 (즉, 컨텍스트 객체에 깊숙이 도달).
• 콧수염보다 글로벌 도우미에 대한 지원이 향상되었습니다.

핸들 단점 :

• 서버에서 렌더링하려면 서버 측 JavaScript가 필요합니다.

출처 : 클라이언트 측 템플릿 분류 : 콧수염, 핸들 바, dust.js 등

하나의 미묘하지만 중요한 차이점은 두 라이브러리가 범위에 접근하는 방식에 있습니다. 콧수염은 현재 컨텍스트 내에서 변수를 찾을 수 없으면 부모 범위로 돌아갑니다. 핸들 바는 빈 문자열을 반환합니다.

이것은 GitHub README에 거의 언급되어 있지 않습니다.

핸들 바는 기본적으로 재귀 적 조회를 수행하지 않는다는 점에서 콧수염과 약간 다릅니다.

그러나 거기에 언급 된 것처럼 핸들 바를 콧수염과 같은 방식으로 작동하게하는 플래그가 있지만 성능에 영향을줍니다.

이는 #변수를 조건으로 사용하는 방법에 영향을줍니다 .

예를 들어 Mustache에서 다음을 수행 할 수 있습니다.

{{#variable}}<span class="text">{{variable}}</span>{{/variable}}

기본적으로 "변수가 존재하고 사실이라면 변수가있는 범위를 인쇄합니다"를 의미합니다. 그러나 핸들 바에서 다음 중 하나를 수행해야합니다.

• 사용하는 {{this}}대신
• 상위 경로를 사용 {{../variable}}하여 관련 범위로 돌아갑니다.
• variable부모 variable객체 내에 자식 값을 정의

원하는 경우 여기 에 대한 자세한 내용을 참조 하십시오 .

참고 : 이 답변은 구식입니다. 게시 당시에는 사실이지만 더 이상은 아닙니다.

콧수염은 많은 언어로 통역을 제공하며, 핸들 바는 자바 스크립트 전용입니다.

그들 사이의 또 다른 차이점은 파일의 크기입니다.

• Mustache.js에는 9kb가 있습니다.
• Handlebars.js에는 86kb 또는 사전 컴파일 된 템플릿을 사용하는 경우 18kb가 있습니다.

Handlebars.js의 성능 이점을 보려면 미리 컴파일 된 템플릿을 사용해야합니다.

출처 : JavaScript 템플릿 엔진 개요

또 하나의 미묘한 차이점은 잘못된 값을 {{#property}}...{{/property}}블록으로 처리하는 것입니다 . 대부분 콧수염 구현은 복종 JS가 있다면 블록을 표현하지 여기 falsiness 것 property인 ''또는 '0'.

핸들 은'' 및에 대한 블록을 렌더링 0하지만 다른 잘못된 값 은 렌더링 하지 않습니다. 템플릿을 마이그레이션 할 때 문제가 발생할 수 있습니다.

"핸들 바"에 대해 언급 된 단점 중 하나가 더 이상 유효하지 않다고 생각합니다.

Handlebars.java를 사용하면 클라이언트와 서버 모두에 대해 동일한 템플릿 언어를 공유 할 수 있습니다. 이는 SEO를 위해 서버 측 렌더링이 필요한 1000 개 이상의 구성 요소로 큰 프로젝트에서 큰 승리입니다.

https://github.com/jknack/handlebars.java를 살펴보십시오.

— 핸들 바에 "this"를 사용하고 콧수염에 변수 블록 내에 중첩 된 변수를 추가 할뿐만 아니라 콧수염에 블록에 중첩 된 점을 사용할 수도 있습니다.

    {{#variable}}<span class="text">{{.}}</span>{{/variable}}