传统页面

本节目标：理解“传统页面”的核心思路，并能把它用于实际开发或面试表达。 ==传统页面，是一个比较书面的叫法，其实就是多页面。早期我们用== HTML + CSS ==写页面的时候，每个页面都会对应一个== .html ==文件，多个== .html ==加上一些跳转逻辑，就变成了一个完整的站点。除了静态== HTML ==外，还有== Node ==渲染的模板文件如== jade==、==ejs==、==swig==等等。它们都是直接渲染== HTML ==到浏览器上。== 传统页面的优缺点

• 首屏加载速度快

==有些同学可能没有理解首屏加载是什么意思，可能以为是网站的首页。其实首屏加载指的是浏览器上首次加载的页面，不仅仅是首页，有可能用户第一次浏览的是商品详情页、关于我们页等。当我们访问一个页面的时候，服务器返回给我们的是一个== HTML ==文件，随后浏览器解析== HTML ==文件，将== DOM ==节点绘制到浏览器上，在上述的过程中，只经历了一次== HTTP ==请求，所以页面展示的速度相对会比较快一些。==

• SEO（搜索引擎优化）效果好

==很多门户网站，如==58==同城、赶集网、汽车之家等都是需要做大量的搜索引擎优化工作。我们在百度、谷歌等搜索引擎上搜索我们需要的内容的时候，搜索引擎会优先匹配更符合你搜索内容的网页。那么网页如何做到和你的搜索内容更加匹配呢？那就需要让页面内的内容尽可能多的让搜索引擎去抓到，这样才能保证广撒网。那么这个搜索引擎优化的原理是什么呢，搜索引擎可以识别静态== HTML ==内容，而传统多页面的开发形式，将所有要展示的内容都放在了静态== HTML ==中，自然就会被搜索引擎的爬虫抓取并分析。==

• 页面切换

==有得必有失，这是不变的真理。每次跳转页面，浏览器都会重新加载一个新的== HTML ==文件，也就是说浏览器又要重新发起一次== HTTP ==请求。当然，这和网速也有一定的关系。网速慢的话，请求响应就会相应的变慢，但是终归是多了一次== HTTP ==请求，再加上多页面多是服务端渲染，每次在服务端内对数据进行请求和渲染，其实也是对服务器的一种压力，页面间来回切换的话，在体验上你就会有明显的卡顿感。==