以下是移动端网站优化中适配与加速的秘诀：

适配方面

1. 使用响应式设计

- 流动性布局：采用百分比而非固定像素值来定义元素的宽度，使布局能随视口宽度自动调整大小，确保在不同设备上保持合理结构。

- 媒体查询：根据不同设备的屏幕宽度、高度等特征应用不同的CSS样式，如针对移动设备和PC设备分别设置字体大小等。

- 灵活的图片和视频：图片和视频使用相对尺寸（如百分比）或视口单位（如vw、vh）设置大小，还可利用媒体查询为不同屏幕尺寸加载不同分辨率的图片。

2. 视口设置：通过设置Viewport Meta标签，指定网页在移动设备上的视口尺寸和缩放比例，确保页面在移动设备上正确显示和缩放。

3. 适配声明与重定向：对于移动站点，当无法确定来源的ua访问时，建议默认返回html5或xhtml类型的移动页面。大型网站可针对不同移动端网页做好适配声明，并用302重定向到对应机型。

加速方面

1. 减少HTTP请求

- 合并文件：将多个CSS或JavaScript文件合并为一个，减少请求数。

- 使用CSS Sprite：把多个小图标合并到一张大图中，通过背景定位显示不同图标，减少图片请求次数。

- 内联关键资源：对于一些小型的CSS和JavaScript代码，可直接内联到HTML中，避免外部文件请求。

2. 优化资源加载

- 压缩资源：对HTML、CSS、JavaScript文件进行压缩，去除不必要的空格、注释和换行符，减小文件体积。对图片进行压缩，选择合适的图片格式，如JPEG、PNG、WebP等，并设置适当的图片质量。

- 懒加载：对于页面中的图片、视频等资源，采用懒加载技术，只有在用户滚动到资源所在位置时才加载，提高页面初始加载速度。

- 设置缓存：合理设置浏览器缓存和服务器缓存，让浏览器在下次访问时可以直接从缓存中获取资源，减少重复下载。

3. 使用内容分发网络（CDN）：将网站的静态资源（如图片、CSS、JavaScript文件等）托管到CDN节点上，用户可以从离自己最近的节点获取资源，加快资源加载速度。

4. 优化代码

- 减少DOM操作：频繁的DOM操作会影响性能，尽量减少不必要的DOM操作，如批量修改元素样式、避免频繁的节点插入和删除等。

- 异步加载JavaScript：将不影响页面初始渲染的JavaScript代码设置为异步加载，避免阻塞页面加载。

- 选择合适的框架和库：避免使用过于庞大和复杂的框架和库，选择轻量级的、适合移动端的框架和库，减少代码体积和加载时间。