23

Tôi tự hỏi nếu có ai tìm ra giải pháp cho vấn đề này. Có cách nào để có được tốt nhất của cả hai thế giới:Ứng dụng web dựa trên trang đơn/trang lai (Angularjs, Ember.js) với cải tiến nâng cao?

  • xây dựng một trang web page-based, với các liên kết vĩnh viễn, khả năng tiếp cận, SEO, và dự phòng duyên dáng/nâng cấp tiến (về cơ bản tất cả best practices of web development các)
  • và, cho những người có javascript, trải nghiệm giao diện người dùng đáp ứng với tải nội dung ajax, không làm mới trang trong khi điều hướng các trang của trang web cơ bản, tải xuống dự phòng tối thiểu các tập lệnh/nội dung/css/v.v. (Tất cả những lợi ích của một khuôn khổ client-side như AngularJs hoặc Ember.js)

Tôi thấy một vài trang web lớn có thể quản lý này (gmail, stackoverflow), và tôi thấy rằng Jeff's new site xây dựng một trần xương phiên bản của trang web trong thẻ noscript.

  1. Là giải pháp cho ứng dụng lai trên trang/một trang để xây dựng hai phiên bản của trang web, gửi cả hai và cho phép khách hàng quyết định xem nó có thể hiển thị? (Đây có phải là những gì gmail không?)
  2. Hoặc là vấn đề mà AngularJS et al. chỉ đơn giản là không được thiết kế để cho phép sự xuống cấp duyên dáng?

Làm đau bộ não DRY của mình để nghĩ rằng # 1 là câu trả lời.

(Lý do tôi tập trung vào AngularJs là tôi thích sự hỗ trợ của nó đối với việc tạo mẫu html, kiểu khai báo, và các nỗ lực của nó để sửa phạm vi js. Ember và các khung công tác khác cũng xuất sắc; cho một trang web lai?)

Trả lời

14

câu hỏi này là một chút của một sắc thái bởi vì câu trả lời là "nó phụ thuộc". Ví dụ: bạn đã đề cập đến Gmail, không có bất kỳ lý do gì mà một ứng dụng như Gmail sẽ cần được lập chỉ mục cho SEO, mặc dù tùy thuộc vào thứ bạn muốn hoặc cần hỗ trợ bạn có thể muốn đảm bảo bạn có thể hỗ trợ không có Javascript.

Tuy nhiên ngay cả đối số "không có javascript" ngày càng trở nên mệt mỏi và yếu đuối, ít nhất là đối với lớp "ứng dụng web". Nếu tôi muốn sử dụng một ứng dụng Windows tôi cần Windows, nếu tôi muốn sử dụng một ứng dụng web được hỗ trợ javascript thì không phải là vô lý khi cho rằng tôi sẽ cần một trình duyệt không bị tê liệt để sử dụng nó.

Tuy nhiên trở lại câu hỏi của bạn, tôi chỉ có thể nói chuyện với AngularJS vì tôi là người quen thuộc nhất với nó. Đối với hầu hết các phần nó cho phép bạn hỗ trợ một cách tiếp cận nâng cao tiến bộ, mặc dù không mong đợi để sử dụng những thứ như định tuyến URL nếu đây là những gì bạn muốn hỗ trợ. Những gì bạn có thể làm là sử dụng các bộ điều khiển AngularJS, các ràng buộc và các chỉ thị tương tự như cách bạn có thể sử dụng jQuery như một cách để tăng cường các tương tác và hành vi của trang. Chỉ cần ghi nhớ cách tiếp cận này sẽ giới hạn nghiêm trọng những gì bạn có thể làm với Angular (hoặc Ember cho vấn đề đó) và nó có thể bắt đầu gây tranh cãi những gì bạn đang nhận được từ phương pháp này mà bạn không thể dễ dàng làm với jQuery một mình .

Thay thế những ngày này là làm những gì các trang web như Twitter đang làm. Đó là cơ bản phục vụ HTML hoàn toàn rendered từ máy chủ cho bất kỳ xem trên tải ban đầu và sau đó sử dụng Javascript cho tải tiếp theo và hành vi giao diện người dùng nâng cao. Điều này rất hiệu quả (mặc dù có lẽ khá khó khăn để thực hiện) nếu bạn thực sự cần hỗ trợ duyệt có và không có Javascript và có thêm lợi ích của việc cải thiện thời gian hiển thị/tải cho yêu cầu đầu tiên. Một lần nữa "nó phụ thuộc" bởi vì nó phụ thuộc rất nhiều vào cách trang web của bạn thực sự hoạt động nếu nó có thể sử dụng điều này. Bạn phải thiết kế cho nó, và nó sẽ không phải là tầm thường hoặc dễ dàng.

Cập nhật:

Đối với những gì nó có giá trị chúng ta đang dùng cách tiếp cận Year of Moo và hiển thị các trang cần SEO sử dụng PhantomJS và gắn bó với cache trạng thái ban đầu của họ nơi nào đó để phục vụ họ lên. Chúng tôi có một nhiệm vụ rake chúng tôi chạy trên các triển khai để cập nhật điều này. Một lần nữa đây chỉ là trạng thái ban đầu nhưng nó giúp giải quyết vấn đề này ngay bây giờ.

Mọi thứ luôn thay đổi và tôi chắc rằng tôi sẽ thay đổi ý định của mình về phương pháp này sau một năm.

2

Bạn đã đọc Google Making AJAX Applications Crawlable của Google chưa. Bạn có thể có ứng dụng trang đơn JavaScript và nội dung có thể thu thập dữ liệu.

Nếu bạn gắn bó với góc, có thú vị Bài chi tiết: Turns out it is possible to have your AngularJS application indexed

+0

Bây giờ trình lập chỉ mục của Google sẽ hoạt động giống như trình duyệt và hiển thị trang như chúng, vì vậy bạn không thực sự cần phải làm gì để làm cho Angular phù hợp hơn cho việc lập chỉ mục: https://googlewebmastercentral.blogspot.no/2015/10 /deprecating-our-ajax-crawling-scheme.html –

Các vấn đề liên quan