Các cách để cải thiện hiệu suất cuộn UIWebView?

Question

Tôi đang xây dựng một ứng dụng bao gồm UIWebView chứa một số lượng lớn các hình ảnh, CSS, video nhúng và trình xử lý chạm JavaScript. Hiệu suất cuộn là nói lắp và tôi đang tìm kiếm thông tin chi tiết về những cách hiệu quả nhất để cải thiện điều này.

Điều gì sẽ xảy ra nếu bất kỳ đặc điểm nào sau đây dẫn đến tụt hậu UIWebView di chuyển? Yếu tố nào khác có thể cản trở hiệu suất?

• Số lượng các hình ảnh
  • Tôi có nên được loại bỏ hình ảnh từ DOM khi người dùng cuộn qua chúng, và thêm chúng trở lại nếu họ di chuyển trở lại?
• Kích thước của hình ảnh
  hình ảnh
  • Will Retina chất lượng trong một lần xem web ảnh hưởng đến hiệu suất di chuyển nhiều hơn các phiên bản nhỏ hơn sẽ?
• ảnh rộng
  • Would thay đổi kích thước hình ảnh trước thời hạn tạo ra một sự khác biệt lớn, chứ không phải dựa trên quan điểm web để quy mô dựa trên tờ khai như width: 100%;?
• CSS
  • Tôi đã tránh box-shadow, nhưng là có thuộc tính CSS khác cũng được biết đến với ảnh hưởng xấu đến hiệu suất di chuyển?

Nếu có bất kỳ nguồn lực khác hoặc các công cụ có thể được sử dụng cho các hồ sơ, tôi đã yêu nghe về chúng.

Answer 1

Tôi đã gặp sự cố tương tự cách đây một thời gian. Tôi thấy rằng việc đặt webview bên trong một scrollview cải thiện hiệu suất cuộn đáng kể. Sau khi tải xong chế độ xem trên web, tôi đã vô hiệu hóa cuộn trên chế độ xem web, đặt khung của chế độ xem web và nội dung của scrollviewSize là kích thước của nội dung của webview.

-(void) webViewDidFinishLoad:(UIWebView *)webView { 
    float size = [[self.webView stringByEvaluatingJavaScriptFromString:@"document.body.offsetHeight"] floatValue]; 
    [self.scrollView setContentSize:CGSizeMake(self.view.frame.size.width, size)]; 
    [webView setFrame:CGRectMake(webView.frame.origin.x, 
           webView.frame.origin.y, 
           webView.frame.size.width, 
           size)]; 

    [(UIScrollView*)[webView.subviews objectAtIndex:0] setScrollEnabled:NO]; 
} 

Tôi giả định rằng các webview không tải một hình ảnh cho đến khi nó sắp sửa xuất hiện trên màn hình, mà gây ra nói lắp, và bằng cách đặt nó trong một scrollview và thiết lập các khung với kích thước nội dung nó phải tải chúng trước thời hạn, nhưng tôi không chắc chắn. Tôi cũng chắc chắn điều này có hậu quả (ví dụ, tăng bộ nhớ sử dụng lên phía trước), nhưng tôi không bao giờ có bất kỳ vấn đề làm theo cách này.

Answer 2

Đây là câu trả lời tôi nhận được từ của Apple phát triển Hỗ trợ kỹ thuật trong một thời gian trước:

Tại thời điểm này, chúng tôi không cung cấp bất kỳ cơ chế để tối ưu hóa việc vẽ của UIWebView. Lý do bạn thấy sự khác biệt là do Mobile Safari và UIWebView không sử dụng cùng một công cụ hiển thị.

Hiệu suất phụ thuộc vào nội dung được tải. Nếu có javascripts đang chạy hoặc plugin đang được sử dụng, điều này có thể cản trở hiệu suất.

Tôi khuyên bạn nên gửi báo cáo lỗi tại số http://developer.apple.com/bugreporter/ nêu chi tiết tình huống của bạn. Điều này cũng sẽ thông báo cho bạn về trạng thái báo cáo lỗi của bạn.

Một lựa chọn tốt để UIWebView sẽ là mã nguồn mở DTCoreText thư viện: https://github.com/Cocoanetics/DTCoreText, dịch vụ hỗ ứng dụng nổi Reader: http://itunes.apple.com/us/app/float-reader/id447992005?mt=8

Answer 3

Các guys tại LinkedIn đã làm việc rộng rãi với UIWebView và HTML5 trên ứng dụng iPad của họ . Toàn bộ nguồn cấp dữ liệu của họ nặng nề với hình ảnh, văn bản và video được hiển thị bên trong UIWebView.

sau Các bài viết trên blog nên cung cấp cho bạn rất nhiều điểm khởi đầu để cải tiến hiệu suất

LinkedIn for iPad: 5 techniques for smooth infinite scrolling in HTML5