Android: WebView cải thiện tốc độ tải của các tệp html cục bộ

Question

Có cách nào để cải thiện tốc độ tải tệp .html cục bộ vào một WebView. Các tệp .html được lưu trữ trong Thư mục /assets.

Như bạn có thể thấy trong đoạn video (Xin lỗi, liên kết bị phá vỡ!), TextView (beackground đỏ) được trả lại trước khi transistion khởi động, trong khi các văn bản trong WebView được hiển thị sau đó. Làm thế nào tôi có thể đạt được để tải WebView nhanh như TextView?

//current implementation 
webView.setInitialScale(1); 
webView.getSettings().setJavaScriptEnabled(true); 
webView.getSettings().setLoadWithOverviewMode(true); 
webView.getSettings().setUseWideViewPort(true); 
webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY); 
webView.setScrollbarFadingEnabled(false); 

webView.loadUrl("file:///android_asset/disclaimer.html"); 

TÓM TẮT

Đó là điều không thể. Tôi đã thử tất cả các bình luận ở đây và nó không tạo ra sự khác biệt.

Lý do tôi hỏi là chúng tôi đã có một ứng dụng cho iOS và Android, chủ yếu bao gồm đơn giản TextViews và Images. Vì vậy, chúng tôi đã có ý tưởng tạo các tệp cục bộhtml mà chúng tôi có thể sử dụng trong cả hai ứng dụng. Trong iOS, nó hoạt động như một sự quyến rũ, nhưng trong Android chúng tôi không thể thoát khỏi thời gian tải, vì vậy tôi luôn có một màn hình trống và sau 100-200ms nội dung xuất hiện.

Tôi đoán Androids WebView bắt đầu hiển thị nếu Hoạt động hiển thị. Điều này hoàn toàn có ý nghĩa trong chế độ trực tuyến, bởi vì bạn không muốn tải một số trang html mà người dùng mở trong một lần nhấn mới trong nền, trước khi thực sự tập trung chúng. Tuy nhiên, ở chế độ ngoại tuyến (tệp html cục bộ được lưu trữ trong ứng dụng assets) hành vi này là không cần thiết, nhưng bạn không thể thay đổi nó.

Bây giờ chúng tôi thực sự bây giờ lý do tại sao phonegap & đồng hút.

Chỉ để lưu nội dung: Cuối cùng, tôi đã sử dụng hoạt động có vùng chứa trống rỗng LinearLayout, nơi bạn có thể chèn nội dung theo chương trình. Mỗi phong cách (dòng tiêu đề 1, tiêu đề 2, nội dung ...) có một mình bố trí tập tin xml

public void insertHeadline(int id){ 

    String text = getString(id); 
    TextView headline = (TextView) inflater.inflate(R.layout.layout_text_headline, null, false); 
    headline.setText(text); 

    //add this TextView to the empty container 
    myLinearLayoutContainerView.addView(headline); 

} 

Answer 1

Không thể xem lại webview màu đỏ nhanh như một textview (trừ khi bạn thực sự đang lạm dụng textview chẳng hạn như tải hàng ngàn dòng văn bản) cho dù bạn bật/tắt bao nhiêu công tắc và có bao nhiêu tối ưu hóa và tinh chỉnh bạn thử. Cơ chế hiển thị hỗ trợ chế độ xem văn bản vì nó có nhiều hạn chế về cách bạn có thể chỉ định thay đổi đối với bản trình bày bình thường của mình, vì webview có thể tải tài nguyên bên ngoài, vì css sửa đổi bản trình bày, vì javascript có thể ảnh hưởng đến bản trình bày, vì nó cần nhiều bộ nhớ hơn và khởi tạo để hỗ trợ tất cả các chức năng này, ...

Đó là lý do tại sao ứng dụng phonegap/cordova không bao giờ trở nên linh hoạt và tương tác như ứng dụng gốc. Vâng, trừ khi ứng dụng gốc chỉ được tạo từ chế độ xem web: P

Bạn vẫn có thể cố gắng cải thiện thời gian tải/hiển thị của chế độ xem web bằng cách sửa đổi cấu hình của nó nhưng bạn nên đợi cho đến khi nội dung của bạn được xác định. Tất cả các cài đặt đó, cho phép cải tiến trong các trường hợp cụ thể và, ví dụ, việc thay đổi loại lớp có thể giúp hoặc làm xấu đi thời gian hiển thị của bạn cho các trang khác nhau. Như Nirmal đã đề cập đến trong câu trả lời của ông, một số trong những người được biết là có tác động lớn hơn là layerType, cacheMode và renderPriority

Tôi cho rằng khó khăn là những gì bạn muốn đạt được là ngăn người dùng xem màn hình không đầy đủ. Bạn có thể hiển thị một webview trước khi hiển thị màn hình của bạn bằng cách sử dụng onPageFinished nhưng nó sẽ không tải nhanh hơn, người dùng sẽ phải đợi lâu hơn cho đến khi màn hình chuyển tiếp và bạn có thể cần một bánh xe quay.

Theo kinh nghiệm của tôi, cách bạn triển khai chuyển đổi là trải nghiệm người dùng tốt hơn và tôi sẽ đợi cho đến khi bạn xác định nội dung html trước khi cố gắng tối ưu hóa thời gian tải.

Nếu bạn đã tìm thấy trải nghiệm hiện tại đã gây khó chịu, tôi sẽ xem xét sử dụng tất cả nội dung html/xem trước web.

Answer 2

WebView sẽ luôn có lần còn làm cho hơn một TextView bản địa. Tôi nghĩ rằng đó là bản chất của nền tảng nhưng có lẽ bạn có thể thử đọc nội dung html vào một chuỗi trước khi tải màn hình (để tránh webview từ hoạt động hệ thống tập tin). Và sau đó đặt Chuỗi bằng:

webview.loadDataWithBaseURL("", earlyReadedHtmlString, "text/html", "UTF-8", ""); 

Về mặt lý thuyết, điều này phải nhanh hơn và công bằng hơn cho webview. Một cách khác là chờ đợi onPageFinished() và sau đó hiển thị textview. Nó có thể là một cách giải quyết.

Answer 3

Tùy thuộc vào ứng dụng web đang được tải.Hãy thử một số phương pháp tiếp cận dưới đây:

Đặt cao làm ưu tiên (bị phản đối từ API 18+):

webview.getSettings().setRenderPriority(RenderPriority.HIGH); 

Bật/tắt khả năng tăng tốc phần cứng:

if (Build.VERSION.SDK_INT >= 19) { 
// chromium, enable hardware acceleration 
webView.setLayerType(View.LAYER_TYPE_HARDWARE, null); 
} else { 
    // older android version, disable hardware acceleration 
    webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null); 
} 

Vô hiệu hóa bộ nhớ cache:

webview.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE); 

Answer 4

Nội dung chậm truy cập vì chúng nằm trong tệp APK, về cơ bản là tệp zip được tôn vinh.

Tôi sẽ viết một thói quen khởi động mà chỉ đơn giản mất các tập tin từ tài sản và viết chúng vào bộ nhớ trong (hoặc lưu trữ bên ngoài nếu họ là khá lớn và không chứa dữ liệu nhạy cảm.

Một khi bạn đã rút ra cho họ từ những apk tài sản, chúng nhanh hơn rất nhiều để truy cập.