架构高性能网站秘笈(五)——Web组件分离

什么是Web组件?

网站的静态网页HTML、JavaScript脚本、CSS样式、图片、动态数据称为网站的Web组件。也就是说,一个Web应用由各种各样的Web组件构成。

为什么要进行Web组件分离?

一个网站的Web组件往往有各自的特点,比如:HTML页面属于静态文件,当用户请求一个HTML页面的时候Web服务器会进行IO操作,读取HTML文件;而用户请求动态数据的时候IO操作会比较少,但会涉及到大量的CPU计算;因此,如果静态内容和动态内容都使用相同服务器配置的话显然不能发挥Web应用最好的性能,因此我们需要对不同的Web组件采取不同的服务器配置方案。因此需要组件分离。

如何进行组件分离?

我们可以把不同的组件放在不同的服务器上,并且根据组件的特点,定制服务器配置,从而发挥组件最好的性能。要实现不同组件指向不同的服务器,我们首先需要为网站解析更多的子域名。

域名解析

假设我们已经拥有顶级域名www.5188.help,那么我们可以到购买域名的网站上设置域名的A标签,从而分出二级域名。以下是我解析的二级域名: - static.5188.help #用于存放静态数据 - api.5188.help #存放动态数据 - css.5188.help #存放css - js.5188.help #存放js - upload.5188.help #存放图片、音频、文档

如何对待不同的组件?

下面具体介绍针对具体组件的服务器配置方案。

1. 静态页面

静态页面HTML以文件的形式存储在存储设备,因此存储HTML页面的服务器需要有较高的IO读写速度,对IO密集型操作,我们要进行如下优化:

  1. 支持epoll。使得Web在高并发情况下仍然保持稳定的吞吐率。
  2. 非阻塞IO。避免不必要的IO等待。
  3. 异步IO
  4. 使用sendfile()系统调用。避免文件系统磁盘缓冲区到用户地址空间的数据复制。
  5. 单进程。避免多进程切换的不必要开销。对于IO密集型的静态内容处理,多进程并不能带来多大的意义。
  6. 使用高转速磁盘。
  7. 使用RAID分区。使得磁盘实现并行读写,提高磁盘吞吐量。
  8. 购买大带宽。

2. 动态内容

动态内容的数据都实时计算生成,或查询数据库得到,为了提升运算速度,因此需要增加CPU核数,增加内存容量,具体做法如下: 1. 使用快的CPU 2. 使用大内存 3. 使用多进程 4. 使用数据库连接池,减去连接建立和释放的开销。

3. CSS样式表和avaScript脚本

一般网站上线后CSS样式表和JavaScript脚本几乎不会发生变化,因此完全可以将css和js在用户浏览器的缓存有效期设置更长的时间。

注:在css、js的URL后可以加一个参数,用来标注当前css、js的版本,如:

<link href="css.5188.help/BSB/css/xxx.css?ver=1.0" />

当服务器中css、js发生修改后,需要将参数进行修改:

<link href="css.5188.help/BSB/css/xxx.css?ver=2.0" />

那么,当浏览器发现css后的参数发生修改时,会重新向服务器请求,而不会使用本地缓存。

4. 图片

对于图片较多的页面,如果每个图片都向服务器请求的话需要消耗大量的时间带带宽,因此服务器向浏览器返回响应信息时一定要设置图片的Keep-Alive参数设为true,延用TCP连接。

Web组件分离的好处

浏览器对于同一域名的并发数会有限制。Web组件分离之后,不同类型的Web组件需要请求不同的域名,从而能够支持更大的并发量,从而能够提升Web组件的下载速度。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏流柯技术学院

Tomcat性能调优方案

一、操作系统调优  对于操作系统优化来说,是尽可能的增大可使用的内存容量、提高CPU的频率,保证文件系统的读写速率等。经过压力测试验证,在并发连接很多的情况下,...

682
来自专栏Laoqi's Linux运维专列

nginx+php-fpm出现502 bad gateway错误解决方法

2145
来自专栏Jack-Cui

Python3网络爬虫(一):利用urllib进行简单的网页抓取

运行平台:Windows Python版本:Python3.x IDE:Sublime text3  一直想学习Python爬虫的知识,在网...

2660
来自专栏月牙寂

k8s源码分析-----kube-proxy(1)Config

第一时间获取文章,可以关注本人公众号 月牙寂道长 yueyajidaozhang

2727
来自专栏吴小龙同學

GitBook 使用

我想把我的博客总结归纳下,于是找到了 GitBook,多了一个写博客地方,我把它做为博客的备份。花了两三天学习了 GitBook,这里记录下。此教程基于 Ma...

4307
来自专栏韩伟的专栏

状态模式:一个Epoll边缘触发的代理服务器设计

设计模式是一门热门的知识,但是何时应该用哪个,却往往不容易掌握,本文以一个Socks5代理服务器的设计为例,介绍状态模式的实践用法。 软件的功能介绍 提供Soc...

3647
来自专栏Java工程师日常干货

深入浅出Nginx前言反向代理服务器?Nginx的Master-Worker模式我们的主战场:nginx.conf

Nginx是一款轻量级的Web服务器、反向代理服务器,由于它的内存占用少,启动极快,高并发能力强,在互联网项目中广泛应用。

723
来自专栏熊二哥

JMeter快速入门

今天的年会已过,仍然是空手而归,不过俺坚信能让生活稳定永远都是努力。由于隔壁组负责年会的抢红包项目,因而趁此机会把通过工具模拟高并发的知识补了补,通过和身边大师...

2125
来自专栏.net core新时代

nginx+iis实现负载均衡

  最近在研究分布式系统架构方面的知识,包括负载均衡,数据库读写分离,分布式缓存redis等。本篇先从负载均衡服务架构入手,关于负载均衡百度百科的定义如下:负载...

2108
来自专栏Coco的专栏

【前端工具】Chrome 扩展程序的开发与发布 -- 手把手教你开发扩展程序

1273

扫描关注云+社区