Performance 撇号CMS的性能工程

因此，经过三周12小时轮班后，我几乎完成了使用撇号构建知识库系统的工作。现在的任务是加快前端的速度。我的问题是：

如何添加expires头：Express内置了名为static的Middleware，我可以在index.js文件下正常实现它吗

缩小JavaScript和CSS：我看到撇号内置了一些东西，但不清楚如何启用它？我是否需要将资产放在特定文件夹中以使其正常工作？现在我在lib/modules/撇号pages/public/JS下有所有的JS文件，在public/CSS下有CSS文件

在服务器上启用GZIP：这里没有提到，但是express确实有GZIP模块，我可以在lib/modules/撇号express/index.js下实现它们吗

---

非常感谢您的帮助。

我是蓬克大道撇号的首席开发者

听起来你发现了我们的部署HOWTO和最近添加的关于缩小的材料，所以你自己整理了这一部分。那很好

至于服务器上的expires头和gzip，虽然您可以直接在节点中执行，但我们不会！一般来说，我们从不让节点直接与最终用户对话。相反，我们使用nginx作为反向代理，这为我们提供了负载平衡，并允许我们直接交付静态文件。nginx是用C/C++编写的，速度更快。gzip和TLS的实现也经过了大量的战斗测试。不需要让javascript做它不擅长的事情

我们通常使用配置nginx，我们创建nginx是为了用一些命令来管理nginx，而不是手工编写配置文件。我们的标准配方包括gzip和expires头

然而，这里是它创建的nginx配置文件的注释版本。您将看到它涵盖了静态文件的负载平衡、gzip和更长的过期时间

# load balance across 4 instances of apostrophe listening on different ports
upstream upstream-example {
  server localhost:3000;
  server localhost:3001;
  server localhost:3002;
  server localhost:3003;
}

server {
  # gzip transfer encoding
  gzip on;
  gzip_types text/css text/javascript image/svg+xml
    application/vnd.ms-fontobject application/x-font-ttf
    application/x-javascript application/javascript;

  listen *:80;

  server_name www.example.com example.com;

  client_max_body_size 32M;

  access_log /var/log/nginx/example.access.log;
  error_log /var/log/nginx/example.error.log;

   # reverse proxy: pass requests to nodejs backends        
  location @proxy-example-80 {
    proxy_pass http://upstream-example;

    proxy_next_upstream error timeout invalid_header http_500 http_502
  http_503 http_504;
    proxy_redirect off;
    proxy_buffering off;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
  }

  # Deliver static files directly if they exist matching the URL,
  # if not proxy to node
  location / {
    root /opt/stagecoach/apps/example/current/public/;
    try_files $uri @proxy-example-80;
    # Expires header: 7-day lifetime for static files
    expires 7d;
  }
}

---

我是庞克大道撇号的首席开发者

听起来你发现了我们的部署HOWTO和最近添加的关于缩小的材料，所以你自己整理了这一部分。那很好

至于服务器上的expires头和gzip，虽然您可以直接在节点中执行，但我们不会！一般来说，我们从不让节点直接与最终用户对话。相反，我们使用nginx作为反向代理，这为我们提供了负载平衡，并允许我们直接交付静态文件。nginx是用C/C++编写的，速度更快。gzip和TLS的实现也经过了大量的战斗测试。不需要让javascript做它不擅长的事情

我们通常使用配置nginx，我们创建nginx是为了用一些命令来管理nginx，而不是手工编写配置文件。我们的标准配方包括gzip和expires头

然而，这里是它创建的nginx配置文件的注释版本。您将看到它涵盖了静态文件的负载平衡、gzip和更长的过期时间

# load balance across 4 instances of apostrophe listening on different ports
upstream upstream-example {
  server localhost:3000;
  server localhost:3001;
  server localhost:3002;
  server localhost:3003;
}

server {
  # gzip transfer encoding
  gzip on;
  gzip_types text/css text/javascript image/svg+xml
    application/vnd.ms-fontobject application/x-font-ttf
    application/x-javascript application/javascript;

  listen *:80;

  server_name www.example.com example.com;

  client_max_body_size 32M;

  access_log /var/log/nginx/example.access.log;
  error_log /var/log/nginx/example.error.log;

   # reverse proxy: pass requests to nodejs backends        
  location @proxy-example-80 {
    proxy_pass http://upstream-example;

    proxy_next_upstream error timeout invalid_header http_500 http_502
  http_503 http_504;
    proxy_redirect off;
    proxy_buffering off;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
  }

  # Deliver static files directly if they exist matching the URL,
  # if not proxy to node
  location / {
    root /opt/stagecoach/apps/example/current/public/;
    try_files $uri @proxy-example-80;
    # Expires header: 7-day lifetime for static files
    expires 7d;
  }
}

---

阅读文档后，我添加了代码minify:true。我必须将所有css文件移到撇号assets/public/css文件夹下。现在，当我启动服务器时，我看到

[nodemon]正在启动'node app.js'缩小，这可能需要一分钟。。。未定义['breaked@import declaration of“/css/bootstrap.css”'、'breaked@import declaration of“/css/app/font awesome.css”、'breaked@import declaration of“/css/app/simple sidebar.css”、'breaked@import declaration of“/css/app/simple sidebar.css”][nodemon]应用程序崩溃-在启动之前等待文件更改…

实际上没关系，它只需要较少的文件作为输入。我试图添加css文件，这就是问题所在。一旦我将文件更改为更少，它就开始正常工作。阅读文档后，我添加了代码minify:true。我必须将所有css文件移到撇号assets/public/css文件夹下。现在，当我启动服务器时，我看到

[nodemon]正在启动'node app.js'缩小，这可能需要一分钟。。。未定义['breaked@import declaration of“/css/bootstrap.css”'、'breaked@import declaration of“/css/app/font awesome.css”、'breaked@import declaration of“/css/app/simple sidebar.css”、'breaked@import declaration of“/css/app/simple sidebar.css”][nodemon]应用程序崩溃-在启动之前等待文件更改…

实际上没关系，它只需要较少的文件作为输入。我试图添加css文件，这就是问题所在。一旦我将文件更改为更少，它就开始正常工作。