Làm việc với bộ sưu tập Backbone lớn

Question

Chúng tôi đang thiết kế ứng dụng xương sống, trong đó mỗi bộ sưu tập phía máy chủ có tiềm năng chứa hàng chục nghìn bản ghi. Tương tự - nghĩ đến việc đi vào chế độ xem 'Mục đã gửi' của một ứng dụng email.

Trong phần lớn các ví dụ Backbone tôi đã thấy, các bộ sưu tập liên quan có tối đa 100-200 bản ghi, và do đó tìm nạp toàn bộ bộ sưu tập và làm việc với nó trong ứng dụng là tương đối dễ dàng. Tôi không tin rằng đây là trường hợp với một bộ lớn hơn nhiều.

Có ai đã thực hiện bất kỳ công việc nào với Backbone trên các bộ sưu tập lớn phía máy chủ không?

• Bạn có gặp phải sự cố về hiệu suất (đặc biệt là trên thiết bị di động) ở kích thước thu thập cụ thể không?
• Bạn đã lấy quyết định nào về số lần tìm nạp từ máy chủ?
• Bạn có tải xuống mọi thứ hoặc chỉ một tập hợp con không?
• Nơi nào bạn đặt logic xung quanh bất kỳ cơ chế tùy chỉnh (Bộ sưu tập mẫu cho ví dụ?)

Answer 1

1. Vâng, vào khoảng 10.000 mặt hàng, các trình duyệt cũ không thể xử lý màn hình tốt. Chúng tôi nghĩ rằng đó là một vấn đề băng thông, nhưng ngay cả ở địa phương, với nhiều băng thông như một máy hiệu suất cao có thể ném vào nó, Javascript chỉ kinda ra. Điều này đúng trên Firefox 2 và IE7; Tôi đã không thử nghiệm nó trên các hệ thống lớn hơn kể từ đó.

2. Chúng tôi đang cố gắng tìm nạp mọi thứ. Điều này không làm việc cho các tập dữ liệu lớn. Nó đặc biệt nguy hiểm với trình duyệt của Android.

3. Dữ liệu của chúng tôi nằm trong cấu trúc cây, với dữ liệu khác tùy thuộc vào sự hiện diện của dữ liệu trong cấu trúc cây. Dữ liệu có thể thay đổi do các hành động từ người dùng khác hoặc các phần khác của chương trình. Cuối cùng, chúng tôi đã tạo cấu trúc cây chỉ tìm nạp các nút hiện có và các phần khác của hệ thống đã xác minh tính hợp lệ của các tập dữ liệu mà chúng phụ thuộc độc lập. Đây là một điều kiện chủng tộc, nhưng trong triển khai thực tế, chúng tôi không bao giờ thấy bất kỳ vấn đề gì. Tôi đã có thể thích sử dụng socket.io ở đây, nhưng quản lý không hiểu hoặc tin tưởng nó.

4. Vì tôi sử dụng Coffeescript, tôi chỉ được thừa kế từ Backbone.Collection và tạo lớp cha của riêng tôi, cũng đã khởi tạo cuộc gọi sync() tùy chỉnh. Cú pháp để gọi phương pháp của một lớp cha là thực sự hữu ích ở đây:

   class Dataset extends BaseAccessClass 
       initialize: (attributes, options) -> 
        Dataset.__super__.initialize.apply(@, arguments) 
        # Customizations go here. 
   

Answer 2

Giống như Elf nói bạn thực sự cần đánh số trang dữ liệu tải từ máy chủ. Bạn sẽ tiết kiệm rất nhiều tải trên máy chủ từ tải xuống các mục bạn có thể không cần. Chỉ cần tạo một bộ sưu tập với các mô hình 10k cục bộ trong Chrome mất nửa giây. Đó là một tải trọng lớn.

Bạn có thể đặt công việc trên một chuỗi CPU vật lý khác bằng cách sử dụng một nhân viên và sau đó sử dụng các đối tượng thoáng qua để gửi nó đến chuỗi chính để hiển thị nó trên DOM.

Khi bạn có một bộ sưu tập mà hiển thị lớn trong hiển thị lười biếng DOM sẽ chỉ giúp bạn có được cho đến nay. Bộ nhớ sẽ tăng dần cho đến khi nó treo trình duyệt (sẽ nhanh chóng trên máy tính bảng). Bạn nên sử dụng đối tượng tổng hợp trên các phần tử. Nó sẽ cho phép bạn thiết lập một kích thước tối đa nhỏ cho bộ nhớ và giữ nó ở đó.

Tôi đang xây dựng một PerfView cho Backbone có thể hiển thị 1.000.000 mô hình và cuộn ở 120FPS trên Chrome. Tất cả mã trên Github https://github.com/puppybits/BackboneJS-PerfView. Nó đã nhận xét vì vậy có rất nhiều tối ưu hóa khác mà bạn cần để hiển thị các tập dữ liệu lớn.