Tôi có nên bao gồm đánh dấu HTML trong phản hồi JSON của mình không?


13

Trong trang web thương mại điện tử, khi thêm một mặt hàng vào giỏ hàng, tôi muốn hiển thị cửa sổ bật lên với các tùy chọn bạn có thể chọn. Hãy tưởng tượng bạn đang đặt mua một chiếc iPod Shuffle và bây giờ bạn phải chọn màu sắc và văn bản để khắc.

Tôi muốn cửa sổ là phương thức, vì vậy tôi đang sử dụng hộp đèn được tạo bởi một cuộc gọi Ajax. Bây giờ tôi có hai lựa chọn:

Tùy chọn 1: Chỉ gửi dữ liệu và tạo đánh dấu HTML bằng JavaScript

Điều tuyệt vời ở đây là nó cắt giảm yêu cầu Ajax xuống mức tối thiểu và không trộn dữ liệu với đánh dấu.

Điều không tuyệt vời ở đây là bây giờ tôi cần sử dụng JavaScript để thực hiện kết xuất của mình, thay vì có một công cụ mẫu ở phía máy chủ thực hiện việc đó. Tôi có thể có thể làm sạch cách tiếp cận một chút bằng cách sử dụng giải pháp tạo khuôn mẫu phía máy khách .

Tùy chọn 2: Gửi đánh dấu HTML

Điều tốt ở đây là tôi có thể có cùng một công cụ tạo khuôn mẫu phía máy chủ mà tôi đang sử dụng cho phần còn lại của các tác vụ kết xuất (Django), thực hiện kết xuất hộp đèn. JavaScript chỉ được sử dụng để chèn đoạn HTML vào trang. Vì vậy, nó rõ ràng để lại kết xuất cho công cụ kết xuất. Có nghĩa với tôi.

Nhưng tôi không cảm thấy thoải mái khi trộn dữ liệu và đánh dấu trong một cuộc gọi Ajax vì một số lý do. Tôi không chắc điều gì khiến tôi cảm thấy khó chịu về điều đó. Ý tôi là, nó giống như mọi trang web được phục vụ - dữ liệu cộng với đánh dấu - phải không?


Câu hỏi tuyệt vời. Nhưng dường như thuộc về stackoverflow.
Saeed Neamati

1
@SaeedNeamati Các câu hỏi thiết kế phần mềm, đặc biệt là các câu hỏi khái niệm bảng trắng như câu hỏi này có chủ đề ở đây và ngoài chủ đề trên Stack Overflow .

Câu trả lời:


10

JSON chỉ nên chứa dữ liệu và không có đánh dấu. Về lâu dài, phương pháp này có thể mở rộng hơn vì có tiềm năng sử dụng dữ liệu JSON trong các phần khác của trang web của bạn. Nếu bạn bao gồm đánh dấu thì việc sử dụng cùng một dữ liệu để điền vào một mẫu khác sẽ trở nên khó khăn hơn nhiều.


2
Điểm tuyệt vời về việc tái sử dụng. Mọi người dường như đang bỏ phiếu cho yêu cầu Ajax chỉ chứa dữ liệu và không có đánh dấu, vì nhiều lý do. Nhưng, lần này là một lớn một. Cảm ơn.
Mike M. Lin

2
Chưa kể rằng JSON không có đánh dấu sẽ nhỏ hơn và sử dụng ít băng thông hơn.

@JackManey: Cũng là một điểm tốt. Nhưng chi phí thực sự của băng thông bổ sung không phải là nhiều sau khi bạn đã ăn chi phí của yêu cầu HTTP. Và tôi có thể tưởng tượng một số thiết lập trong đó bạn biết các máy khách rất tệ đến mức sẽ tốn nhiều tiền hơn để tạo DOM theo thời gian thực bằng JavaScript. Hãy suy nghĩ: Ứng dụng nội bộ với người dùng trên các máy / trình duyệt cổ.
Mike M. Lin

3

Tôi sẽ gửi dữ liệu trong yêu cầu và xây dựng đánh dấu trong js. Một lợi ích nữa là sẽ có ít sử dụng băng thông hơn. Đó là một sở thích cá nhân nhưng giữ đánh dấu phía máy khách khỏi phía máy chủ có lẽ là một ý tưởng tốt hơn. Tôi cũng có một trang web Django và tôi chỉ sử dụng hệ thống tạo khuôn mẫu để đặt một số biến thể json trên trang (một yêu cầu ít hơn ajax để thực hiện) và sử dụng các tệp src khi phát triển trên máy của tôi. Tất cả các phía máy khách được thực hiện với ExtJS.


Tôi thích ý tưởng của bạn về việc ghi dữ liệu JSON vào trang - không phải ở đây vì tôi không tìm nạp dữ liệu bổ sung cho đến khi tôi biết mục nào bạn đang thêm vào giỏ hàng của mình. Thực hiện một yêu cầu cho bố cục trang, sau đó một giây cho dữ liệu dường như là phổ biến những ngày này. Có dữ liệu trong một biến JavaScript sẽ loại bỏ nhu cầu về yêu cầu HTTP thứ hai mà không cần có hai bit mã kết xuất khác nhau (nghĩa là máy khách và máy chủ).
Mike M. Lin

Ồ tôi thấy máy chủ của bạn không đủ tiên tiến để biết người dùng sẽ đưa gì vào giỏ hàng trước đó;).
vui mừng

1

Tôi nghĩ bạn đã nói về ưu và nhược điểm của cả hai. Tại sao không nhìn vào tùy chọn thứ 3 có javascript cho hộp đèn của bạn được tạo từ chế độ xem django. Sau đó, JSON của bạn chỉ chứa dữ liệu để cập nhật nó cho mỗi chế độ xem?

Những gì bạn có thể làm là bọc tất cả mã khuôn mẫu vào các biến javascript và sau đó xuất chúng bằng javascript sau khi nhận được yêu cầu JSON ở phía máy khách.


Cảm ơn vi đa trả lơi. Đó thực sự là những gì tôi muốn nói trong tùy chọn 1. Hộp đèn như một thùng chứa sẽ bị đốt cháy trong trang nhưng bị ẩn đi. Dữ liệu JSON từ yêu cầu Ajax sẽ được sử dụng để tạo nội dung trong vùng chứa. Một số nội dung đó sẽ được đánh dấu bằng HTML. Làm thế nào bạn giải thích tùy chọn 1? Có lẽ đó có thể là lựa chọn thứ ba của tôi.
Mike M. Lin

Tôi đã suy nghĩ điều gì đó dọc theo dòng của stackoverflow.com/questions/6008908/ này sau đó sử dụng JSON để thay thế dữ liệu sau khi tải ban đầu
Ryan Gibbons

0

Bạn nên sử dụng công cụ mẫu để đánh dấu và giữ một trường ẩn ở đâu đó để lưu trữ các giá trị, sau đó bạn có thể tìm thấy trong tài liệu bằng cách sử dụng bộ chọn.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.