网站前端和后台性能优化13

简介: 设定ETags (Configure ETags)

设定ETags (Configure ETags)

tag:server

实体标签(ETags)是服务器和浏览器用于确定浏览器中缓存的组件和服务器中的是否对应的一种机制。("entity"是组件的另一种说法:图片、脚本、样式表等等)添加 ETags用于辨别组件提供了比单纯利用“最后修改时间”更为灵活的机制。ETag

是一个唯一标识组件的特定版本的字符串。它的唯一格式规范是字符串必须被引号引用。来源服务器使用ETag响应头来设定一个组件的ETag:

HTTP/1.1 200 OK

Last-Modified: Tue, 12 Dec 2006 03:03:59 GMT

ETag: "10c24bc-4ab-457e1c1f"

Content-Length: 12195

当浏览器晚些时候需要检测一个组件时,它使用If-None-Match 头部把ETag传回来源服务器。如果ETag匹配了,会返回一个304状态码,在这个例子里它会减少12195个字节的响应:

GET /i/yahoo.gif HTTP/1.1

Host: us.yimg.com

If-Modified-Since: Tue, 12 Dec 2006 03:03:59 GMT

If-None-Match: "10c24bc-4ab-457e1c1f"

HTTP/1.1 304 Not Modified

ETag的问题是它们往往在网站的一个服务器中被设为唯一的,当浏览器从一个服务器得到了组件并在稍后试图到另一个服务器验证时,ETag会不匹配,而这在使用多个服务器来处理请求的网站中是很常见的。默认情况下,Apache和IIS在ETag中嵌入的数据戏剧性的减少了应用多台服务器的网站的ETag验证成功几率。

Apache1.3和2.新版本的ETag格式是inode-size- timestamp。虽然一个给定的文件在多台服务器中处于同一个目录,而且有同样的大小,权限,时间戳,但它的inode在不同服务器中是不同的。

IIS5.0和6.0有同样的问题。IIS中ETag的格式是Filetimestamp:ChangeNumber。 ChangeNumber用来跟踪IIS配置的改变次数。一个网站的所有IIS不可能有相同的ChangeNumber。

这导致的结果是,Apache和IIS对完全相同的组件产生的ETag在不同服务器间不能匹配。如果ETags不匹配,用户不会得到小而快的304响应,而是一个普通的200响应和组件的所有数据。如果你把你的网站放在了一个服务器里,这不会是一个问题。但如果你的网站有多台服务器,而且你使用了Apache和IIS 默认的ETag配置,你的用户会访问页面的速度会变慢,你的服务器加载的程度更高,消耗了更大的带宽,代理服务器不能有效的缓存你的内容。即使你的组件有一个ar future Expires头部,当用户重载或者刷新页面时,依然会发送一个GET请求。

如果你不打算利用ETags提供的灵活的验证模式,你最好把ETag统统移除。Last-Modified头部的验证方式给予组件的时间戳。移除ETag 同时减少响应和随后的请求中的HTTP头部大小。这篇微软的支持文档描述了怎样在IIS中移除 ETags。在Apache中,你只要在Apache配置文件中添加如下一行:

FileETag none

目录
相关文章
|
2月前
|
缓存 JavaScript 前端开发
前端vue的性能优化都有那些方式?
【4月更文挑战第8天】 Vue.js 性能优化技巧包括:路由懒加载,按需加载路由以加快页面加载;组件优化,如用`v-show`替换`v-if`,使用计算属性代替方法;虚拟滚动提升大数据列表性能;图片优化,如使用懒加载;减少不必要的重渲染,借助`v-once`或`shouldComponentUpdate`;以及考虑使用服务端渲染(SSR)提升首屏加载速度。注意平衡优化与代码复杂性之间的关系。
61 0
|
2月前
|
Web App开发 缓存 前端开发
【Flutter前端技术开发专栏】Flutter中的性能优化与内存管理
【4月更文挑战第30天】本文探讨了Flutter应用的性能优化和内存管理。关键点包括:减少布局重绘(使用`const`构造函数和最小化依赖),选择合适的动画实现,懒加载和按需加载以提升性能。同时,强调了避免内存泄漏和优化内存使用,利用Flutter提供的性能分析工具。实践案例展示了如何优化ListView,包括使用`ListView.builder`和缓存策略。通过这些方法,开发者可以提升应用的响应性、流畅性和稳定性。
【Flutter前端技术开发专栏】Flutter中的性能优化与内存管理
|
3天前
|
缓存 前端开发 JavaScript
前端常见的性能优化方案?
【7月更文挑战第14天】前端性能优化包括代码压缩、资源合并、图片优化、缓存策略和DOM操作改进。例如,压缩CSS、JS,懒加载图片,使用CDN,事件委托,启用HTTP/2,及利用性能工具进行评估和优化。目标是加快加载速度,提升用户体验和服务器效率。
17 2
|
6天前
|
前端开发 JavaScript PHP
技术心得:前端点击按钮,导入excel文件,上传到后台,excel接收和更新数据
技术心得:前端点击按钮,导入excel文件,上传到后台,excel接收和更新数据
|
1月前
|
前端开发 JavaScript UED
前端开发中的性能优化技巧
在当今Web应用开发中,优化性能已成为一项至关重要的任务。本文将介绍一些前端开发中常用的性能优化技巧,包括减少HTTP请求、优化资源加载、提升渲染速度以及利用现代浏览器的功能等方面的方法。
|
2月前
|
前端开发 JavaScript UED
【专栏:HTML 与 CSS 前端技术趋势篇】Web 性能优化:CSS 与 HTML 的未来趋势
【4月更文挑战第30天】本文探讨了CSS和HTML在Web性能优化中的关键作用,包括样式表压缩、选择器优化、DOM操作减少等策略。随着未来趋势发展,CSS模块系统、自定义属性和响应式设计将得到强化,HTML新特性也将支持复杂组件构建。同时,应对浏览器兼容性、代码复杂度和性能功能平衡的挑战是优化过程中的重要任务。通过案例分析和持续创新,我们可以提升Web应用性能,创造更好的用户体验。
|
2月前
|
存储 缓存 监控
【Flutter前端技术开发专栏】Flutter中的列表滚动性能优化
【4月更文挑战第30天】本文探讨了Flutter中优化列表滚动性能的策略。建议使用`ListView.builder`以节省内存,避免一次性渲染所有列表项。为防止列表项重建,可使用`UniqueKey`或`ObjectKey`。缓存已渲染项、减少不必要的重绘和异步加载大数据集也是关键。此外,选择轻量级组件,如`StatelessWidget`,并利用Flutter DevTools监控性能以识别和解决瓶颈。持续测试和调整以提升用户体验。
【Flutter前端技术开发专栏】Flutter中的列表滚动性能优化
|
2月前
|
前端开发 数据处理
【Flutter 前端技术开发专栏】Flutter 中的滚动性能优化与无限列表实现
【4月更文挑战第30天】本文探讨了 Flutter 中的滚动性能优化和无限列表实现。关键点包括:1) 滚动性能直接影响用户满意度,优化可提升响应速度;2) 影响因素有布局复杂度、频繁重绘和数据处理;3) 优化措施包括懒加载、简化布局、减少不必要的重绘和高效处理数据;4) 无限列表通过监听滚动位置,动态加载新数据;5) 实现时注意加载策略、数据处理效率和内存管理。案例分析和总结强调了优化在实际开发中的重要性。
【Flutter 前端技术开发专栏】Flutter 中的滚动性能优化与无限列表实现
|
2月前
|
设计模式 缓存 前端开发
【Flutter前端技术开发专栏】Flutter开发最佳实践与性能优化指南
【4月更文挑战第30天】本文为Flutter开发者提供了最佳实践和性能优化指南。建议采用MVC、Provider/Repository和InheritedWidget设计模式,注重代码结构和状态管理。遵循最佳实践,如避免全局变量,智能使用Stateful和Stateless Widgets,以及利用`const`和`final`。性能优化要点包括减少渲染次数、优化图片资源、异步处理和使用Profile模式分析。通过测试确保应用质量与稳定性,打造高性能、高质
【Flutter前端技术开发专栏】Flutter开发最佳实践与性能优化指南
|
2月前
|
缓存 监控 前端开发
前端如何做性能优化?
【4月更文挑战第21天】前端性能优化涉及代码、图片、资源加载、渲染、网络等多个层面,包括压缩合并代码、利用缓存、压缩图片、使用CDN、减少DOM操作、启用HTTP/2等策略。其他方法还包括代码拆分、使用Web Workers和性能监控。优化过程应根据项目实际需求灵活调整,并注意平衡性能与代码可读性。
34 2