在網(wǎng)頁設(shè)計(jì)中，優(yōu)化代碼是提高頁面加載速度的重要方式之一。壓縮 JS 和 CSS 代碼可以有效地減小文件大小，在提高用戶體驗(yàn)的同時(shí)也減輕了服務(wù)器的負(fù)擔(dān)。

以下是一些常用的壓縮 JS 和 CSS 代碼的工具和方法：

壓縮 JS 代碼

/* 使用 UglifyJS2 壓縮 JS 代碼 */
npm install uglify-js -g
uglifyjs input.js -o output.js -c -m
/* 使用 Closure Compiler 壓縮 JS 代碼 */
java -jar closure-compiler.jar --js input.js --js_output_file output.js

壓縮 CSS 代碼

/* 使用 YUI Compressor 壓縮 CSS 代碼 */
java -jar yuicompressor.jar input.css -o output.css
/* 使用 CleanCSS 壓縮 CSS 代碼 */
npm install clean-css-cli -g
cleancss -o output.css input.css

另外，有些構(gòu)建工具也提供了對 JS 和 CSS 代碼的壓縮功能，比如 Grunt 和 Gulp。

需要注意的是，在壓縮代碼之前，一定要確保代碼的正確性。可以使用 JSLint 或 JSHint 對 JS 代碼進(jìn)行檢查，使用 CSS Lint 對 CSS 代碼進(jìn)行檢查。檢查通過之后再進(jìn)行壓縮，可以避免因?yàn)檎Z法錯(cuò)誤而導(dǎo)致的頁面崩潰。