雖然 vue 的伺服器端渲染(ssr)相當快速，但是由於建立元件例項和虛擬 dom 節點的開銷，無法與純基於字串拼接(pure string-based)的模板的效能相當。在 ssr 效能至關重要的情況下，明智地利用快取策略，可以極大改善響應時間並減少伺服器負載。
vue服務區快取分為頁面快取、組建快取和介面快取
頁面快取：
在server.js中設定
const lru = require('lru-cache')
const microcache = lru()
const iscacheable = req =>else
}'*', (req, res) =>
}
const errorhandler = err =>else`)
console.error(err)
}
}
const context =
renderer.rendertostring(context, (err, html) =>
res.end(html)
microcache.set(req.url, html)// 設定當前快取頁面的內容
})
})
組建快取：
在server.js中設定如下：
functioncreaterenderer(bundle, template) )
})
}
letrenderer
if(isprod)else)
}
要快取的組建
exportdefault
},
created() ,
computed: {},
asyncdata() {},
methods: {},
servercachekey: props => props.id
}
servercachekey返回的 key 應該包含足夠的資訊，來表示渲染結果的具體情況。如果渲染結果僅由props.item.id決定，則上述是乙個很好的實現。但是，如果具有相同 id 的 item 可能會隨時間而變化，或者如果渲染結果依賴於其他 prop，則需要修改servercachekey的實現，以考慮其他變數。如果 servercachekey返回常量將導致元件始終被快取，這對純靜態元件是有好處的。
介面快取：
在create-api-server.js中設定快取
import qs from 'qs'import axios from 'axios'
import md5 from 'md5'
import lru from 'lru-cache'
const microcache = lru()
export function createapi() else)
returnnewpromise((resolve, reject) => ,
method:'get'
}).then(res =>
console.log('返回新資料')
resolve(res.data)
}).catch(error => )
})
},
post(url, params = {})
returnnewpromise((resolve, reject) =>
}).then(res =>
resolve(res.data)
}).catch(error => )
})
}
}
}
returnapi
}
這樣就ok了
所有的問題都是我在日常生活中用到的，可能會有不正確或者不是最佳解決方案，希望留下你的建議和意見，共同學習，共同進步
博主位址
vue依賴快取 Vue SSR服務端渲染之資料快取
當咱們在作vue的伺服器端渲染時，可能會碰到各類各樣的坑，記憶體洩露就是其中的一種。固然，致使記憶體洩露的緣由有不少，不合理使用axios也是其中一種，那下面我給你們介紹一下如何有效的避免請求中的記憶體洩露。vue 1.安裝快取依賴 lru cache npm install lru cache d...
vue服務端渲染nuxt（一）
由於專案需要，所以對nuxt進行了初步學習，自己也進行總結一下，方便以後查詢瀏覽 2 如果你的npm版本在5.2.0，你可以使用下面的命令進行安裝 3 它在安裝的時候會提示你是否安裝一些依賴包，有後台的，例如koa express。還會問你是否安裝一些ui庫等，這些看個人或者整體的專案而決定。安裝完...
服務端渲染or預渲染
今天木有引言嚶嚶嚶 瀏覽器核心分兩個部分 渲染引擎 js引擎 解析html以構建dom樹 構建render樹 布局render樹 繪製render樹 不過有三個點需要注意 雖然能夠很快渲染出頁面，但是沒有執行react時頁面無法進行互動 獲取第乙個位元組時會更加慢一點，由於ssr需要將完整的渲染過的...