Nodejs 打包压缩的问题

发布于 1周前 作者 caililin 来自 nodejs/Nestjs

Nodejs 打包压缩的问题
完全是 web 开发新人,问题太简单别笑话我哈

我知道现在前端用了 React, Angular 那后端只要提供数据也就是 Restful 就可以了,前端有各种各样的打包工具压缩 js 之类的。


那如果是传统的 server 端渲染呢? 就是所有 html, css, js 都是在服务端的,每一个请求过来就发一个 html 回去,向 grunt 这样的工具也能压缩这些文件?(主要是 css, js 我想)然后把压缩过的文件放在后端?

顺便问问,现在是不是基本都是前端渲染了,server 端渲染的还多吗?

谢谢


6 回复

react 之类的也可以做 server 端渲染,非前后端分离的项目还是有一大堆。


可以在发布前把所有服务端 js uglify 一下,用混淆后的版本传给前端

第一个问题的答案就是你说的这样,只不过 grunt/gulp/webpack 等工具的应用场景远不止压缩静态资源这一点。
第二个问题,服务器端渲染( SSR )的 web 项目还非常非常多,桌面系统平台上的客户端渲染( CSR )的 web 项目屈指可数,移动端的稍微多一点。究其原因,大多数 web 项目不需要太过复杂的交互体验,更关键的原因则是用 SSR 技术栈可以实现大部分开发需求,同时将 SSR 开发思想转换为 CSR 有一定的门槛,很多开发者刻意逃避这个转换过程,导致 CSR 的普及就如同 python3.x 替代 python2.x 那样艰难。

如果只看压缩,服务端渲染打包工具不是很必要,gzip 就够了,但是打包工具主要解决的不是压缩问题而是工作流的问题吧。

服务端渲染的话
能做的主要就是
1. js / css 文件压缩
2. js / css 文件合并
3. js / css 文件版本控制
4. js / css 文件 cdn

在Node.js中,打包和压缩通常涉及将多个文件或目录合并成一个文件,并进行压缩以减少文件大小。这通常用于部署应用时,以减少服务器负载和加快传输速度。

以下是使用archiverfs-extra库来实现Node.js项目的打包和压缩的示例代码:

首先,确保你已经安装了这些库:

npm install archiver fs-extra

然后,你可以使用以下代码来打包和压缩一个目录:

const fs = require('fs-extra');
const archiver = require('archiver');

async function zipDirectory(sourceDir, outPath) {
  const output = fs.createWriteStream(outPath);
  const archive = archiver('zip', {
    zlib: { level: 9 } // 最大压缩级别
  });

  output.on('close', () => console.log(archive.pointer() + ' total bytes'));
  archive.on('error', (err) => throw err);

  archive.pipe(output);
  archive.directory(sourceDir, false);
  await archive.finalize();
}

zipDirectory('./sourceDirectory', './output.zip')
  .then(() => console.log('Directory successfully zipped'))
  .catch(err => console.error('Error zipping directory:', err));

在这个示例中,zipDirectory函数接受两个参数:要打包的源目录(sourceDir)和输出文件的路径(outPath)。它使用archiver库创建一个ZIP文件,并将源目录的内容添加到ZIP文件中。最后,它调用finalize方法来完成压缩过程。

这个示例展示了如何使用Node.js进行基本的打包和压缩操作。根据你的需求,你可能需要调整代码来处理特定的文件或目录结构。

回到顶部