通过实施动静分离架构，将静态资源（如图片、脚本、样式表等）部署至独立二级域名，并整合第三方CDN全球加速服务及云对象存储方案，可显著优化网站性能指标。

此策略可同时实现：

• 利用浏览器多域名并发机制提升资源加载效率；
• 通过CDN边缘节点缓存降低网络延迟，改善用户访问体验；
• 云存储服务弹性扩展能力有效降低服务器带宽压力和运维成本。

从SEO维度考量，独立资源域名可规避主域Cookie污染，配合CDN智能调度形成的全球加速网络，更有利于搜索引擎爬虫抓取效率及网站权重提升，形成"用户体验-访问速度-搜索排名"的正向循环优化体系。

下面介绍在 typecho 中实现动静分离的步骤：

分离主题静态文件

静态文件 Nginx 配置

如果不使用第三方CDN及对象存储服务，那仅需要在 nginx 配置中添加一个 server 就行。

server {
   listen 80;
   server_name static.yangqi.co;

   # 这里直接将 root 目录指向主题主目录地址
   root /opt/usr/themes;

   location ~* ^.+\.(css|js|ico|gif|jpg|jpeg|png|map)$ {
       log_not_found off;
       # 关闭日志
       access_log off;
       # 缓存时间7天
       expires 30d;
   }
   
   # 不用 PHP 配置，更安全
}

更改模板输出的静态文件链接

1. 最简单直接的修改方法，将模板文件中

    <link rel="stylesheet" href="<?php $this->options->themeUrl('normalize.css'); ?>">
    <link rel="stylesheet" href="<?php $this->options->themeUrl('grid.css'); ?>">
    <link rel="stylesheet" href="<?php $this->options->themeUrl('style.css'); ?>">

改为静态域名地址：

    <link rel="stylesheet" href="//static.yangqi.co/normalize.css">
    <link rel="stylesheet" href="//static.yangqi.co/grid.css">
    <link rel="stylesheet" href="//static.yangqi.co/style.css">

• 缺点： 以后切换成其他模板时，都得手动改一次

2. config.inc.php 文件中增加常量

通过代码分析，发现只需要定义常量 __TYPECHO_THEME_URL__ 的值，就可以实现静态资源地址的修改

• 缺点： 无法适配多个主题，因为定义 __TYPECHO_THEME_URL__ 后，$this->options->themeUrl() 方法将不会再拼接当前主题模板名称

3. 静态资源插件

为了方便配置修改，我简单的手撸了一个插件，通过该插件可方便的修改静态资源地址

注意：静态化模式设置为 仅当前主题 后，需要将 nginx 配置中 root 设置为当前主题的子目录，如 /opt/usr/themes/default

• 优势： 静态化模式设置为 themes 主目录 后，会自动拼接当前主是名称，从而支持多主题的静态资源共存

分离插件静态文件

插件静态文件的分离比较简单：

1. 在 config.inc.php 中增加常量：

const __TYPECHO_PLUGIN_URL__ = '//plugins.yangqi.co'

2. 再按上面 静态文件 Nginx 配置 ，修改 server_name，修改 root 指向插件目录：

server {
   server_name plugins.yangqi.co;

   root /opt/usr/plugins;

   # 其他配置不变，省略……
}