Atitit.h5 web webview性能提升解決方案-----fileStrore緩存離線存儲+http方案
1. 業務場景 android+webview h5 css背景圖性能提升1
2. 根據標准,到目前為止,H5 一共有6種緩存機制,有些是之前已有,有些是 H5 才新加入的。1
2.1. 各種方案的比較,如下圖2
3. Attilax的解決之道 file 緩存+http3
3.1. 圖片的下載3
3.2. Jsbridge 4android5
3.3. http協議6
4. 參考8
圖片的緩存大概兒需要500m的規模..
1.
浏覽器緩存機制
2.
3.
Dom Storgage(Web Storage)存儲機制
4.
5.
Web SQL Database 存儲機制
6.
7.
Application Cache(AppCache)機制
8.
9.
Indexed Database (IndexedDB)
10.
11.
File System API
12.
作者:: ★(attilax)>>> 綽號:老哇的爪子 ( 全名::Attilax Akbar Al Rapanui 阿提拉克斯 阿克巴 阿爾 拉帕努伊 ) 漢字名:艾龍, EMAIL:[email protected]
轉載請注明來源: http://www.cnblogs.com/attilax/
按照以上的方式都不適合...最好的還是file api緩存..file api android 默認不支持...使用jsbridge解決..
顯示圖片,直接使用文件路徑,不能顯示,,使用file://協議也不能..使用datauri,三,android上慢的要命,業馬是base64 encode decode閃的..
子好使用http協議了..走ok蘭...
package com.attilax.img;
public class imgx4android {
public String save2localHighPerf(String urlx, String localpath,
String urlHostPart) {
String imageFileNoPath = PathUtil4android.getPathNohostNoApproot(
urlx, urlHostPart);
String sdRoot = new PathUtil4android().getInnerSDCardPath(); // /storage/sdcard
localpath = localpath.replace("$sd$", sdRoot);
//
localpath = localpath + "/" + imageFileNoPath;
// saveBitmap(imageFilePath,localpath);
File f = new File(localpath);
if (f.exists()) {
// f.delete();
return localpath;
}else
{
PathUtil4android.createAllPath(localpath);
}
try {
urlx = UrlX.encodeURI(urlx);
URL url = new URL(urlx);
HttpURLConnection conn = (HttpURLConnection) url.openConnection();
conn.setConnectTimeout(7000);
conn.setRequestMethod("GET");
int responseCode = conn.getResponseCode();
if (responseCode != 200)
throw new RuntimeException(
"cant get img from getBitmapFromUrl:" + urlx
+ " responseCode:" + responseCode);
// if (responseCode == 200) {
InputStream inputStream = conn.getInputStream();
// Bitmap bitmap = BitmapFactory.decodeStream(inputStream);
StreamUtil strx = new StreamUtil();
FileOutputStream out = new FileOutputStream(localpath);
strx.convertStream(inputStream, out);
strx.flushNclose(out);
return localpath;
// }
} catch (Exception e) {
ExUtil.throwEx(e);
}
return localpath;
}
@JavascriptInterface
public String invoke4( String method,String p2,String p3,String p4)
{
List<String> li=new ArrayList();
li.add(p2);li.add(p3);li.add(p4);
Object[] oa=li.toArray();
return invoke(method,oa);
}
// sdk17�汾���ϼ���ע�� solu click btn ma fein ..
@JavascriptInterface
public String invoke( String method, Object... p1) {
String classname = refx.getClassName(method);
String meth_name = refx.getMethodName(method);
Object o;
boolean flag = true;
String trace = "$def e";
try {
o = ConstructorUtils.invokeConstructor(Class.forName(classname),
null);
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
// throw new RuntimeException(e);
flag = false;
trace = ExUtil.getTrace(e);
return trace;
}
if (flag) {
try {
return (String) MethodUtils.invokeMethod(o, meth_name, p1);
} catch (Exception e) {
Throwable e2=e;
if( e instanceof InvocationTargetException)
{
// TODO Auto-generated catch block
e2=e.getCause();
// throw new RuntimeException(e);
}
e2.printStackTrace();
trace = ExUtil.getTrace(e2);
return trace;
}
}
// Handler handler = new Handler();
// // Callable<V>
// handler.post(new Runnale(){
//
// public void run(){
//
// // 更新UI界面元素代碼
//
// }
//
// });
// handler.
return trace;
}
public class AtiHttpServer {
public static void main(String[] args) {
HTTPServer srv=new HTTPServer();
srv.open("127.0.0.1", 7788);
srv.addRequestListener(new HTTPRequestListenerImp());
System.out.println("---http start");
srv.start();
System.out.println("---http finish over");
}
public class HTTPRequestListenerImp implements org.cybergarage.http.HTTPRequestListener
{
private void httpRequestRecieveX(HTTPRequest httpReq) {
String f=httpReq.getParameterValue("file");
String filePaths = httpReq.getParameterValue("file");
try
{
File file = new File(filePaths);
// ��ȡ�ļ��Ĵ�С
long contentLen = file.length();
// ��ȡ�ļ�����
String contentType = FileUtil.getFileType(filePaths);
// ��ȡ���ļ���
InputStream contentIn =new FileInputStream(file);
if (contentLen <= 0 || contentType.length() <= 0
|| contentIn == null)
{
httpReq.returnBadRequest();
return;
}
HTTPResponse httpRes = new HTTPResponse();
httpRes.setContentType(contentType);
httpRes.setStatusCode(HTTPStatus.OK);
httpRes.setContentLength(contentLen);
httpRes.setContentInputStream(contentIn);
httpReq.post(httpRes);
contentIn.close();
}
catch (MalformedURLException e)
{
httpReq.returnBadRequest();
return;
}
catch (SmbException e)
{
httpReq.returnBadRequest();
return;
}
catch (IOException e)
{
httpReq.returnBadRequest();
return;
}
}
H5 緩存機制淺析 移動端 Web 加載性能優化 - OPEN 開發經驗庫.html