Sự khác biệt giữa Mustache.js và Handlebars.js là gì?

Sự khác biệt chính tôi đã thấy là:

• Tay lái cho biết thêm #if, #unless, #with, và#each
• Tay lái thêm người trợ giúp
• Mẫu tay lái được biên dịch (Mustache cũng có thể)
• Tay lái hỗ trợ đường dẫn
• Cho phép sử dụng {{this}}trong các khối (xuất ra giá trị chuỗi của mục hiện tại)
• Handlebars.SafeString() (và có thể một số phương pháp khác)
• Tay lái nhanh hơn từ 2 đến 7 lần
• Bộ ria mép hỗ trợ các phần đảo ngược (nghĩa là if !x ...)

(Vui lòng sửa lại cho tôi nếu tôi sai với những điều trên.)

Có sự khác biệt lớn nào khác tôi đang thiếu?

Bạn đã đóng đinh khá nhiều, tuy nhiên các mẫu Mustache cũng có thể được biên dịch.

Mustache thiếu người trợ giúp và các khối nâng cao hơn vì nó cố gắng trở nên không logic. Trình trợ giúp tùy chỉnh của Tay lái có thể rất hữu ích, nhưng thường kết thúc việc đưa logic vào các mẫu của bạn.

Mustache có nhiều trình biên dịch khác nhau (JavaScript, Ruby, Python, C, v.v.). Tay lái bắt đầu bằng JavaScript, bây giờ có các dự án như django-tay lái , tay lái , tay lái, ruby , lightncandy (PHP) và tay lái-objc .

Bộ ria mép:

• Sự lựa chọn rất phổ biến với một cộng đồng lớn, năng động.
• Hỗ trợ phía máy chủ bằng nhiều ngôn ngữ, bao gồm cả Java.
• Các mẫu không logic làm rất tốt việc buộc bạn phải tách bản trình bày khỏi logic.
• Cú pháp rõ ràng dẫn đến các mẫu dễ xây dựng, đọc và bảo trì.

Nhược điểm ria mép:

• Một chút quá logic-ít: các tác vụ cơ bản (ví dụ: các hàng thay thế nhãn với các lớp CSS khác nhau) rất khó.
• Xem logic thường được đẩy trở lại máy chủ hoặc được triển khai dưới dạng "lambda" (chức năng có thể gọi được).
• Để lambdas hoạt động trên máy khách và máy chủ, bạn phải viết chúng bằng JavaScript.

Tay lái thuận:

• Các mẫu không logic làm rất tốt việc buộc bạn phải tách bản trình bày khỏi logic.
• Cú pháp rõ ràng dẫn đến các mẫu dễ xây dựng, đọc và bảo trì.
• Biên dịch chứ không phải là mẫu giải thích.
• Hỗ trợ tốt hơn cho các đường dẫn hơn ria mép (nghĩa là tiếp cận sâu vào một đối tượng bối cảnh).
• Hỗ trợ tốt hơn cho người giúp đỡ toàn cầu hơn ria mép.

Nhược điểm tay lái:

• Yêu cầu JavaScript phía máy chủ để hiển thị trên máy chủ.

Nguồn: Sự cố ném templating phía máy khách: ria mép, tay lái, Dust.js, v.v.

Một sự khác biệt tinh tế nhưng có ý nghĩa nằm ở cách hai thư viện tiếp cận phạm vi. Bộ ria mép sẽ rơi trở lại phạm vi cha nếu nó không thể tìm thấy một biến trong bối cảnh hiện tại; Tay lái sẽ trả về một chuỗi trống.

Điều này hầu như không được đề cập trong GitHub README, nơi có một dòng cho nó:

Tay lái hơi lệch khỏi Mustache một chút ở chỗ nó không thực hiện tra cứu đệ quy theo mặc định.

Tuy nhiên, như đã lưu ý ở đó, có một lá cờ để làm cho Tay lái hoạt động giống như Mustache - nhưng nó ảnh hưởng đến hiệu suất.

Điều này có ảnh hưởng đến cách bạn có thể sử dụng #các biến như điều kiện.

Ví dụ trong Mustache bạn có thể làm điều này:

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

Về cơ bản nó có nghĩa là "nếu biến tồn tại và là sự thật, hãy in một khoảng với biến trong đó". Nhưng trong Tay cầm, bạn sẽ phải:

• sử dụng {{this}}thay thế
• sử dụng đường dẫn cha, nghĩa là {{../variable}}để quay trở lại phạm vi có liên quan
• định nghĩa một variablegiá trị con trong variableđối tượng cha

Thêm chi tiết về điều này, nếu bạn muốn họ, ở đây .

LƯU Ý: Câu trả lời này đã lỗi thời. Đó là sự thật tại thời điểm nó được đăng, nhưng không còn nữa.

Mustache có trình thông dịch bằng nhiều ngôn ngữ, trong khi Tay cầm chỉ là Javascript.

Một điểm khác biệt giữa chúng là kích thước của tệp:

• Mustache.js có 9kb,
• Handlebars.js có 86kb hoặc 18kb nếu sử dụng các mẫu được biên dịch trước .

Để xem các lợi ích hiệu suất của Handlebars.js, chúng ta phải sử dụng các mẫu được biên dịch trước.

Nguồn: Tổng quan về Công cụ tạo khuôn mẫu JavaScript

Một sự khác biệt tinh tế hơn là việc xử lý các giá trị giả trong {{#property}}...{{/property}}các khối. Hầu hết các triển khai ria mép sẽ chỉ tuân theo giả mạo JS ở đây, không hiển thị khối nếu propertylà ''hoặc '0'.

Tay lái sẽ kết xuất khối cho ''và 0, nhưng không phải các giá trị giả khác. Điều này có thể gây ra một số rắc rối khi di chuyển các mẫu.

Tôi cảm thấy rằng một trong những khuyết điểm được đề cập cho "Tay cầm" không còn thực sự hợp lệ nữa.

Giờ đây, Handbars.java cho phép chúng tôi chia sẻ cùng một ngôn ngữ mẫu cho cả máy khách và máy chủ, đây là một chiến thắng lớn cho các dự án lớn với hơn 1000 thành phần yêu cầu kết xuất máy chủ để SEO

Hãy xem https://github.com/jknack/handlebars.java

Ngoài việc sử dụng "this" cho các tay cầm và biến được lồng trong khối biến cho ria mép, bạn cũng có thể sử dụng dấu chấm lồng trong một khối cho ria mép:

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