前后端分离系列

2020-01-21  本文已影响0人  汤姆猫_6074

本系列不仅是文章,也会改动一些webpack的配置
基于webpack从0开始搭建react的ts开发环境系列

webpack从0开始搭建react的ts开发环境系列中我们选用了koa做为一个前后端分离的前端服务器,

server.js

const path = require('path');
const Koa = require('koa');
const send = require('koa-send');
const Router = require('koa-router');
const app = new Koa();
const router = new Router();
// 匹配了所有url 
router.get(['/', '/**'], async (ctx) => {
  const url = ctx.path;
  await send(ctx, './index.html', {
      root: path.join(__dirname, 'dist'),
      maxAge: 1
    });
})
app.use(router.routes()).use(router.allowedMethods())
app.listen(3000);

在我们简简单单打包了一个带antd且按需加载的组件以后,


image.png

已经接近了1m

在cache时间为1的时候,用户每次打开网站,都要加载js文件,但是我没有改动js文件的内容,这就造成了极大的浪费,还降低了用户的体验

接下来就是 缓存篇
前后端分离系列-缓存篇

上一篇 下一篇

猜你喜欢

热点阅读