重庆网站供奉战犯,网站建设初步规划书,做国外网站选择vps,网站页面构成背景
目前随着数据和图表的逐渐增多#xff0c;Grafana 页面加载速度明显变慢#xff0c;严重影响了用户体验#xff0c;几次都有骂娘的冲动.#xff0c;因此我们需要对 Grafana 进行优化#xff0c;以提升加载性能。
对于速度优化#xff0c;我们可以从以下方面进行入…背景
目前随着数据和图表的逐渐增多Grafana 页面加载速度明显变慢严重影响了用户体验几次都有骂娘的冲动.因此我们需要对 Grafana 进行优化以提升加载性能。
对于速度优化我们可以从以下方面进行入手 优化前端资源加载 使用反向代理和压缩通过 NGINX 或其他反向代理服务器启用 gzip 压缩和缓存静态资源减少页面加载的时间。 静态资源缓存确保静态资源如 CSS、JS 等在浏览器中缓存以避免每次加载都重新获取这些资源。 优化grafana server端服务器资源 增加服务器性能检查服务器的 CPU、内存和 I/O 是否有瓶颈适当增加服务器资源配置。 调整 Grafana 服务器配置增加 Grafana 的 concurrent_requests_limit 设置允许更多的并发请求。 数据库优化 如果你使用的是 Grafana 自己的 sqlite 或 MySQL/PostgreSQL请确保这些数据库被适当优化数据库性能问题也可能导致慢加载。 分离数据源 多实例 Prometheus如果你使用的是 Prometheus 数据源可以考虑使用多个 Prometheus 实例来分担负载特别是如果你的查询数据量很大。 优化数据源查询 减少查询时间范围设置默认时间范围为较短的时间段如过去 5 分钟或 15 分钟以减少加载时的数据量。 使用高效的数据源检查你的数据源如 Prometheus 或 Elasticsearch是否有性能瓶颈。数据源的响应速度慢会直接影响 Grafana 的加载速度。 优化查询确保你的查询尽可能高效避免不必要的复杂计算或过滤条件。使用 rate() 或 avg_over_time() 等函数优化大数据量的查询。 检查网络延迟
这些方案从易到难顺序如下 检查网络延迟 优化数据源查询 优化grafana server端服务器资源 分离数据源 优化前端资源加载 数据库优化
目前我遇到的问题是网络没有延迟数据源采集到的数据量不大使用了多个prometheus实例而且grafana server端内存使用率不到 30% 所以只剩两个选择了一个是前端资源优化一个是数据库优化
数据库优化涉及到一个备份迁移的过程感觉相对来说复杂点所以尝试了一下优化grafana前端资源
本篇文章主要涉及的是 优化grafana前端资源
实践
下面内容是基于docker的方式进行演示
缓存哪部分内容
grafana静态文件的目录是在/usr/share/grafana/public 我们需要将这部分内容放到缓存中或者CDN或者OSS中
由于CDN和OSS都需要花钱我们暂时就用nginx来做一个类似缓存的功能
注意事项
这里我建议直接在正在运行的grafana容器中把这个public包下载下来想办法下载比如压缩后下载docker cp也行因为grafana运行了很长时间里面或多或少会新增一些js文件而这些文件是在官方纯净版public是没有的
官方纯净版Download Grafana | Grafana Labs 选择对应的版本下载window版本解压后里面有public文件
nginx操作
部署一个nginx将public静态文件夹放到nginx下面
default.conf如下
server {listen 80;listen [::]:80;server_name xx.xx.xx;location /grafana-oss/9.5.7/public/ {alias /tmp/public/;# 跨域配置add_header Access-Control-Allow-Origin *;add_header Access-Control-Allow-Methods GET, POST, OPTIONS;add_header Access-Control-Allow-Headers DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization;autoindex on;autoindex_exact_size on;autoindex_localtime on;}error_page 500 502 503 504 /50x.html;location /50x.html {root /usr/share/nginx/html;}}
内容解释
location 必须是/grafana-oss/你的grafana版本/public/因为grafana后台请求时这些是它源码里面携带的地址你自己改不了
alias /tmp/public/ 这个路径是 下载下来的public 放在 nginx容器里面的某个位置我这里是/tmp/public/可以自定义当然你也可以是用root两者的区别nginx 中location中root和alias的区别
配置完成后执行下面命令进行热加载如果你选择重启容器下面命令可以不执行
nginx -t # nginx校验
nginx -s reload # nginx热加载不用启动容器接下来验证一下
访问地址域名/grafana-oss/9.5.7/public 修改grafana配置文件
配置文件的位置一般在/etc/grafana/grafana.ini
在[server]下增加以下内容 cdn_url https://xxx 这个是刚刚nginx的地址https://ip:port即可
[analytics]
check_for_updates true
[grafana_net]
url https://xxx
[log]
mode console
[paths]
data /var/lib/grafana/
logs /var/log/grafana
plugins /var/lib/grafana/plugins
provisioning /etc/grafana/provisioning
[server]
domain xxxxx
root_url https://xxxx
cdn_url https://xxx
[auth.gitlab]
enabled true
allow_sign_up true
...
[database]
typesqlite3
cache_mode shared注意这里你的grafana地址是https的话建议你nginx也是https,因为https跳转http的话会有点问题
配置完成之后重启grafana容器即可
验证
此时打开grafana如果发现地址是修改后的nginx地址即修改成功 如果是404的话有下面几个原因
public没有相对应的文件nginx location有问题或者alias有问题跨域问题
拓展
修复sqlite3数据库
在替换完成之后我在保存图表的过程报错error saving dashboard failed to save dashboard
后台日志为
loggercontext userId0 orgId0 uname t2024-09-20T02:58:49.667754459Z levelinfo msgRequest Completed methodGET path/api/live/ws status401 remote_addr103.90.188.115 time_ms11 duration11.749188ms size27 referer handler/api/live/ws
loggercontext userId1 orgId1 unameadmin t2024-09-20T02:58:49.893549608Z levelerror msgFailed to save dashboard errorsaving dashboard failed: database disk image is malformed remote_addrxxxxx traceID
loggercontext userId1 orgId1 unameadmin t2024-09-20T02:58:49.893663102Z levelerror msgRequest Completed methodPOST path/api/dashboards/db/ status500 remote_addrxxx time_ms101 duration101.326151ms size51 refererhttps://grafana.ljdong.net/d/ea7794xxxxfromnow-30morgId1tonow handler/api/dashboards/db注意看他有一个database disk image is malformed这个代表是sqlite3文件数据库损坏了所以保存不了
解决方案
修复sqlite数据库切换mysql或者其他数据库更稳定权限问题
修复sqlite数据库的方案
https://www.sqlite.org/download.html 网站上下载 sqlite-tools 工具
解压上面的压缩包并在命令行模式下进入该目录运行 sqlite3.exe
# 打开损坏的数据库文件
.open d:/grafana.db
# 进行检测
PRAGMA integrity_check;
# 设置导出文件为 tmp.sql
.output d:/tmp.sql
# 将 grafana.db 中的内容以 sql 方式导出到 tmp.sql
.dump
# 创建 temp.db 数据库
.open d:/temp.db
# 从 tmp.sql 中导入数据
.read d:/tmp.sql
# 退出
.quit # temp即为修复好的数据库还有一种方案是使用SQLite Expert Professional 工具提供的 repair 来修复 db 文件这种方案我没试通感兴趣的可以试试 k8s部署nginx脚本
方便测试
deployment.yaml
---
apiVersion: apps/v1
kind: Deployment
metadata:annotations: {}labels:app: nginx-grafananame: nginx-grafananamespace: tools
spec:progressDeadlineSeconds: 600replicas: 1revisionHistoryLimit: 10selector:matchLabels:app: nginx-grafanastrategy:rollingUpdate:maxSurge: 25%maxUnavailable: 25%type: RollingUpdatetemplate:metadata:creationTimestamp: nulllabels:app: nginx-grafananamespace: toolsspec:containers:- image: docker-cf.registry.cyou/nginx:1.22.0imagePullPolicy: IfNotPresentname: nginxports:- containerPort: 80protocol: TCPresources: {}terminationMessagePath: /dev/termination-logterminationMessagePolicy: FilevolumeMounts:- mountPath: /etc/nginx/conf.d/name: nginx-configreadOnly: true- mountPath: /tmpname: storagednsPolicy: ClusterFirstrestartPolicy: AlwaysschedulerName: default-schedulersecurityContext: {}terminationGracePeriodSeconds: 30volumes:- configMap:defaultMode: 420name: grafana-nginxname: nginx-config- name: storagepersistentVolumeClaim:claimName: pvc-grafana---
apiVersion: v1
kind: Service
metadata:annotations: {}labels:app: nginx-grafananame: nginx-grafananamespace: tools
spec:internalTrafficPolicy: ClusteripFamilies:- IPv4ipFamilyPolicy: SingleStackports:- port: 80protocol: TCPtargetPort: 80selector:app: nginx-grafanasessionAffinity: Nonetype: ClusterIP---
apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:annotations: {}name: nginx-grafananamespace: tools
spec:ingressClassName: nginxrules:- host: xxxxxxxhttp:paths:- backend:service:name: nginx-grafanaport:number: 80path: /pathType: Prefixtls:- hosts:- xxxxxsecretName: xxxxxconfigmap.yaml
---
apiVersion: v1
data:default.conf: |server {listen 80;listen [::]:80;server_name xxxx;location /grafana-oss/9.5.7/public/ {alias /tmp/public/;add_header Access-Control-Allow-Origin *;add_header Access-Control-Allow-Methods GET, POST, OPTIONS;add_header Access-Control-Allow-Headers DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization;autoindex on;autoindex_exact_size on;autoindex_localtime on;}error_page 500 502 503 504 /50x.html;location /50x.html {root /usr/share/nginx/html;}}
kind: ConfigMap
metadata:name: grafana-nginxnamespace: tools
