流量耗费1TB云成本千元的一则性能优化案例

Contents

1 一项目背景
2 二分析思路和原因
3 三解决问题
- 3.1 1 优化代码
4 四复盘总结

一项目背景

近期查看华为云账单消费时，发现有些异常的带宽流浪费用：

从费用上看，发现是上行流量，觉得奇怪。补充项目信息，应用部署在华为云，数据流向图：Client–>DNS–>华为云WAF–>华为云ELB–>转发至后端ECS–>返回给ELB–>返回给WAF–>Client。

二分析思路和原因

1 通过资源ID定位到流量消耗在ELB

登录华为云控制台，进入EIP弹性公网管理界面，通过带宽ID：8f248608-90a2-4175-b07e-70006da2b93b定位到对应的ELB。

2 通过ELB查看后端服务器组

进入ELB界面，查看后端服务器组，定位到后端服务器有5台，分别是几个不同的项目。

3 控制台查看机器流量

逐一对每台机器流量进行排查，的确发现有一台ECS机器流量异常。

4 查看NGINX日志

通过goaccess工具分析应用系统的NGINX请求日志，发现有对一个js文件的流量请求达到惊人的1.1TB。

5 统计NGINX访问最多的前10个URL地址

进一步分析，查看NGINX请求，发现访问比较多的URL资源：

awk '{print $7}' qyxyd.log | sort|uniq -c| sort -rn| head -10 | more
root@xmxyd-17xx:/etc/nginx/logs# awk '{print $7}' qyxyd.log | sort|uniq -c| sort -rn| head -10 | more
 674633 /
 672633 /home
 652434 /_nuxt/js/vendors/app.1751528723734.js
 652386 /_nuxt/js/pages/home/index.1751528723734.js
 652230 /_nuxt/js/pages/credit_institution/index/pages/financial_institution/index/pages/financial_shop/index/pages/ho/245b0134.1751528723734.js
 652225 /_nuxt/js/app.1751528723734.js
 652124 /_nuxt/img/left_arrow.0c6667f.png
 652083 /_nuxt/img/newYear1.fc48a87.jpeg
 652054 /_nuxt/js/runtime.1751528723734.js
 652029 /_nuxt/img/bar-sort.0c296c8.png
root@xmxyd-17xx:/etc/nginx/logs#

6 查看这个js文件究竟是啥

Chrome浏览器，控制台，查看js，发现压缩之后1.8Mb，原始文件更是有7Mb多。加载耗时2.66秒。

7 寻求开发同事介入支持

寻求开发同事支持，查看该js文件里有大量的json文件，查看源代码，原来是全国各市区县的地图json文件，一共有300多个，平均每个文件几十个kb，全部打包到该js文件里了，不大才怪呢。经过分析，访问该站点时，只需要加载该项目所在市区的地图就行，根本不需要把全国各市区县的地图json文件全部打包到该js文件里。

三解决问题

1 优化代码

优化之后，上测试环境，测试同事验证没问题，发布到生产环境。

可以看到，生产环境该js文件压缩之后，原文件大小从7777kb降低到只有115kb，”瘦身”了7777/115=67倍多。压缩之后，也从1804kb降低到只有43kb，“瘦身”了1804/43=41.953 倍。

四复盘总结

一个小小的js文件，造成流量请求1.1TB，成本千元。

系统性能优化都在细节里，代码里装的都是细节。

感谢身边几位同事的协助分析支持。周末愉快。今天2025年8月29日，农历七月初七，牛郎织女将在今晚跨越那条银河。想起儿时暑假的夜空，长辈们讲述这个美好爱情故事的场景……

Post Views: 70

一 项目背景