Tôi đang tạo ứng dụng web sencha bằng cách sử dụng sencha touch 2.2.1. Trong ứng dụng của tôi, tôi có màn hình bao gồm một vùng chứa nơi tôi đã thêm nhiều bảng. Một bảng điều khiển bao gồm hai bảng, một bảng điều khiển trên cùng và bảng điều khiển bên trong.ứng dụng sencha chậm lại khi hiển thị trên chủ đề ui
Khi khởi tạo trang, tôi đang gọi ajax api để tìm nạp danh sách dữ liệu cho bảng trên cùng của mỗi mục trong vùng chứa. và trên bảng điều khiển hàng đầu được nhấp, tôi đang gọi api cho mục đó để tìm nạp dữ liệu cho bảng điều khiển bên trong. Khi kết thúc cuộc gọi api, tôi sẽ kết xuất dữ liệu vào bảng điều khiển bên trong và hiển thị bảng điều khiển đó. Mã này giống nhau cho tất cả các mục trong vùng chứa trên bảng điều khiển hàng đầu được nhấp.
Ngoài ra còn có một nút ở trên cùng để 'expandAll' sẽ gọi api cho tất cả các mục trong vòng lặp for one after one và hiển thị dữ liệu cho mỗi bảng điều khiển bên trong. Đầu tiên tôi gọi một api và sau đó nhận được phản hồi rằng tôi đang lưu trữ trong cửa hàng và hiển thị trên màn hình sau đó gọi api tiếp theo, như thế này cho tất cả các mục.
getDetailData:function(params){
var detailStore=Ext.getStore('DetailData');
detailStore.load({
callback:function(data,opt,success) {
detailStore.storeDetailData(data);
_this.onShowDetailData(data);
// now call next api from here until all items data fetched and displayed
}
});
}
Trong trường hợp này, tìm nạp tất cả dữ liệu mục và hiển thị trên chuỗi đang mất nhiều thời gian và ứng dụng sẽ chậm hơn.
Ngoài ra trong khi kết xuất dữ liệu, tôi phải áp dụng bộ lọc trên cửa hàng để lọc dữ liệu trước khi hiển thị dữ liệu cho mỗi lần.
Tôi muốn biết làm cách nào để xử lý và hiển thị này hoạt động. Khi gọi api ajax và tìm nạp dữ liệu từ máy chủ không mất nhiều thời gian hơn nhưng việc xử lý và hiển thị sẽ mất nhiều thời gian hơn.
Bất kỳ suggessions về vấn đề này,
nhờ
Có bao nhiêu mục hoặc tổng số cuộc gọi API mà chúng ta đang nói đến ở đây? Các mẫu mục phức tạp như thế nào? – OhmzTech
Tối thiểu 10 và tại các cuộc gọi tối đa 14 api mà chúng tôi đang thực hiện tại đây. Và mục mẫu là cấu trúc phức tạp, Một bảng có bố cục vbox và hai bảng trong đó, 1. Bảng điều khiển (layout = hbox), trong đó chúng tôi có 5 bảng và hai danh sách 2. Panel (layout = hbox) , trong đó chúng tôi có 6 danh sách và hai ô – nleshjinde
Tôi đã giải quyết vấn đề hiển thị này. Đối với mọi thành phần sencha, sencha đang tạo thêm cấu trúc bởi chính nó. Trong ứng dụng của tôi, tôi đã sử dụng nhiều thành phần sencha hơn với các khung nhìn phức tạp và nhiều thành phần bên trong hơn. Vì vậy, bây giờ tôi đã sử dụng bảng điều khiển duy nhất và tôi đang tạo duy nhất html thay vì nhiều thành phần sencha và trực tiếp thiết lập văn bản HTML cuối cùng này thành bảng điều khiển như setHtml. Vì vậy, trong trường hợp này chúng tôi đang ghi đè cấu trúc sencha và hiển thị đơn giản đang xảy ra. – nleshjinde