1、首次加载需耗时,但是在此加载的应该是缓存的页面,再调用的时候直接显示出来,不要重新渲染:
if (MyDemo.myPanel != undefined) { try { this.getHtmlForWebview(); MyDemo.myPanel.reveal(vscode.ViewColumn.Active); return; } catch (error) { consoleEx.debug(error); consoleEx.debug("webview is colsed"); } } MyDemo.myPanel = vscode.window.createWebviewPanel(MyDemo.viewType, "Comment", column, { enableScripts: true, retainContextWhenHidden: true, localResourceRoots: [ vscode.Uri.file(path.join(this._extensionPath, "media")) ] }); this.getHtmlForWebview();
2、将页面加载放到前面,页面包含的数据往后延迟待页面显示了再发送过来。在webview的js界面初始化函数中通过postMessage()发消息给后台,让后台在把数据过来。
3、通过webpack打包,将多种静态资源 js、css、less 转换成一个静态文件,减少了页面的请求,提升webview加载性能。