node缓存框架memory-cache

2021-02-11 15:53:08

参考地址 Simple server side cache for Express with Node.js——Express 实现简单的服务器端缓存【翻译】

第一次翻译,不是很好,但大概意思应该还可以。有错误,请多多指正。

    express是我目前为止见过扩展性最好的web框架。它的中间件结构使它可以轻松地以标准化方式添加额外的功能。
    本次主题,我们将会讨论一个很小很简单,但功能非常强大、有用的中间件。它将会帮助你提升你的express Web程序的性能,而且无需任何依赖。

关于服务端缓存


    无论是在 desktop, mobile or web哪一方面,Cache都常被我们用来提升程序性能。当处理web应用程序的时候,虽然可以使用当前所有浏览器都支持的响应头来进行客户端缓存,从而提升页面加载效率。但当一个内容非常繁杂的页面需要2s来进行HTML输出的时候,即使启用客户端缓存该页面,服务器仍然需要针对每一个来访用户进行页面渲染。想想一个大型的新闻门户网站首页,难道他们要针对每一个用户一遍又一遍地处理HTML吗?
    这时候服务器缓存就派上用场了。使用服务器缓存的目标是对相同的客户端请求返回相同的内容。在上面的例子里,第一个请求仍然需要2s处理HTML,但是接下来请求将会命中缓存,服务器可以在几毫秒内发送响应内容。
    有很多种方法可以实现服务器缓存,例如NGINX以及类似于CloudFlare的CDN。在这里,我们将会使用nodejs和express来轻松简便地实现它。

代码展示


    我们的目标是轻松实现服务器缓存。接下来,我们开始吧!
    我们将充分利用 memory-cache npm模块来将内容添加到缓存中。中间件如下:

var mcache = require('memory-cache');var cache = (duration) => {  return (req, res, next) => {    let key = '__express__' + req.originalUrl || req.url    let cachedBody = mcache.get(key)    if (cachedBody) {
      res.send(cachedBody)      return
    } else {
      res.sendResponse = res.send
      res.send = (body) => {
        mcache.put(key, body, duration * 1000);
        res.sendResponse(body)
      }
      next()
    }
  }
}12345678910111213141516171819

    它将把请求的url作为key值进行缓存查询。一旦查询到缓存,将会直接发送响应报文。否则,就会在响应报文发送到客户端之前,对响应进行缓存。然后调用下一个中间件。
    这里有一个非常简单的例子——关于如何缓存一个繁重的处理页面。

app.get('/', cache(10), (req, res) => {
  setTimeout(() => {
    res.render('index', { title: 'Hey', message: 'Hello there', date: new Date()})
  }, 5000) //setTimeout was used to simulate a slow processing request
})12345

     注意,上述路由包含两个中间件。一个是关于缓存,另一个是真正用于处理请求的中间件。在这种情况下,当该路由收到第一次请求的时候,将不会立刻返回响应,而是会停留5s。但是在接下来的10s,连续的请求将会直接从缓存中得到响应,而不需要再去等待5s。有得必有失,该方法的缺点在你的响应报文中含有动态内容的时候将会展现出来。在上面的路由中,如果我们将当前时间作为参数传递给视图引擎,那么缓存过期(10s)之前响应内容中都会含有相同的日期。

    这里非常棒的一点就是,以上方法适用于HTML,JSON,XML以及其他任何内容类型的响应。

    你可以轻松地引入该中间件到已存在的站点中,来缓存任何你想要缓存的路由。

    注意:不要缓存 GET  POST 方法

    在这个例子中,我们使用了在内存中缓存内容的NPM模块,这有利有弊。

        - 在内存中缓存速度最快
        - 使用简单,不需要添加额外的依赖。
        - 如果服务器或进程出现故障,缓存将会丢失
        - 由于每个进程在自己的内存区间存储缓存内容,所以Node.js的多个进程之间内存不共享。

    要解决大部分问题的一个选择是使用诸如 Redis 的分布式缓存服务。它可以仅仅通过一个npm 模块 express-redis-cache中间件来实现。

'use strict'var express = require('express');var app = express();var mcache = require('memory-cache');

app.set('view engine', 'jade');var cache = (duration) => {  return (req, res, next) => {    let key = '__express__' + req.originalUrl || req.url    let cachedBody = mcache.get(key)    if (cachedBody) {
      res.send(cachedBody)      return
    } else {
      res.sendResponse = res.send
      res.send = (body) => {
        mcache.put(key, body, duration * 1000);
        res.sendResponse(body)
      }
      next()
    }
  }
}

app.get('/', cache(10), (req, res) => {
  setTimeout(() => {
    res.render('index', { title: 'Hey', message: 'Hello there', date: new Date()})
  }, 5000) //setTimeout was used to simulate a slow processing request
})app.get('/user/:id', cache(10), (req, res) => {
  setTimeout(() => {    if (req.params.id == 1) {
      res.json({ id: 1, name: "John"})
    } else if (req.params.id == 2) {
      res.json({ id: 2, name: "Bob"})
    } else if (req.params.id == 3) {
      res.json({ id: 3, name: "Stuart"})
    }
  }, 3000) //setTimeout was used to simulate a slow processing request
})app.use((req, res) => {
  res.status(404).send('') //not found
})app.listen(3000, function () {  console.log('Example app listening on port 3000!')
})123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051


  • 2019-12-10 11:15:08

    用CSS给SVG 的内容添加样式

    SVG图形的一个最常见用例是图标系统,其中最常用的SVG sprite技术就是使用SVG<use> 元素在文档中任意位置“实例化”图标。 使用<use>元素实例化图标或任何其它的SVG元素或图像,给元素添加样式时经常会碰到一些问题。这篇文章的目的是尽可能给你介绍一些方法来解决:使用<use>引入的内容添加样式受限的问题。 但是在开始之前,我们先快速浏览一下SVG的主要结构和分组元素,然后慢慢进入use的世界中,以及shadow DOM,然后重回CSS的怀抱。我们会逐步讲解为什么给<use>内容添加样式会比较麻烦,以及有什么好的解决方案。

  • 2019-12-10 16:21:05

    display:flex的子元素无法设置宽度

    子元素有个flex-shrink属性,表示在父元素宽度不够的情况下是自动收缩不?0表示不自动收缩,1表示自动收缩;所以将子元素(图片)添加属性:flex-shrink:0;即

  • 2019-12-10 21:14:11

    axios文件上传功能+formData

    在项目中使用axios上传文件,记得new一个纯净的axios或者考虑用ajax请求。因为axios在项目估计已经用了全局配置请求头等信息,这里的配置可能被全局请求头拦截,导致请求失败。 2.1构造formData 作者:exmexm 链接:https://www.jianshu.com/p/9c708a47d8a5 来源:简书 著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

  • 2019-12-11 16:04:15

    CSS中的 “var()” 和 “:root”

    var() var()函数可以代替元素中任何属性中的值的任何部分。var()函数不能作为属性名、选择器或者其他除了属性值之外的值。(这样做通常会产生无效的语法或者一个没有关联到变量的值。)

  • 2019-12-11 16:18:51

    npm发布vue组件

    开发之前先看看官网的 开发规范 我们开发的之后期望的结果是支持 import、require 或者直接使用 script 标签的形式引入,就像这样

  • 2019-12-11 16:21:00

    .vue文件 加scoped 样式不起作用

    在vue组件中,为了使样式私有化(模块化),不对全局造成污染,在style标签上添加scoped属性,以表示它只属于当下的模块。但是要慎用,因为在我们需要修改公共组件(第三方库或者项目中定制的组件)的样式的时候,scoped会造成很多困难,组要增加额外的复杂度。

  • 2019-12-11 16:22:04

    Vue中的scoped和scoped穿透,scoped原理

    在Vue文件中的style标签上有一个特殊的属性,scoped。当一个style标签拥有scoped属性时候,它的css样式只能用于当前的Vue组件,可以使组件的样式不相互污染。如果一个项目的所有style标签都加上了scoped属性,相当于实现了样式的模块化。