性能报告之HTML5 性能测试报告
<h2 style="color: black; text-align: left; margin-bottom: 10px;">1. 引言</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">1.1. 编写目的</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML5 <span style="color: black;">做为</span>当前“最火”的跨平台、跨终端(硬件)<span style="color: black;">研发</span>语言，越来越受到前端<span style="color: black;">研发</span>者 的<span style="color: black;">注意</span>，<span style="color: black;">没</span>论是 PC 端还是当前“火热”的移动端，其前端<span style="color: black;">研发</span>人员的占比均越来越高。此 消彼长，HTML5 <span style="color: black;">研发</span>者的<span style="color: black;">增多</span>自然<span style="color: black;">引起</span> WPF / Flex / QT 等前端技术<span style="color: black;">研发</span>人员的缩减。为了 <span style="color: black;">处理</span>前端“跨平台”的问题，并应对<span style="color: black;">研发</span>人员稀缺的窘境，<span style="color: black;">咱们</span>迫切的<span style="color: black;">必须</span><span style="color: black;">选取</span>或更换新的 技术路线，而 HTML5 当为首选。<span style="color: black;">这次</span>测试目的是为了验证<span style="color: black;">运用</span> HTML5 <span style="color: black;">做为</span>前端技术路线，能 否满足大屏(高分辨率，超过 8K)可视化的展示需求。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">1.2. 测试背景</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">因为</span> WPF 技术越来越边缘化，<span style="color: black;">研发</span>人员越来越少，成本越来越高，为了以后<span style="color: black;">制品</span>的升级 换代，<span style="color: black;">咱们</span>迫切<span style="color: black;">必须</span>寻找主流前端技术的替代品。<span style="color: black;">日前</span>来看HTML5技术可能是<span style="color: black;">将来</span>前端技术 的主流，其<span style="color: black;">针对</span>移动端、桌面端、还有三维方面都<span style="color: black;">拥有</span>良好的兼容性。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">1.3. 测试<span style="color: black;">目的</span></p> 测试各大主流浏览器，当图形工作站的输出分辨率超过8K时能否正常的<span style="color: black;">表示</span>WEB页面， 并流畅的显示动画效果。
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"> 测试各大主流浏览器对脚本语言(JAVASCRIPT)的解析性能。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"> 测试各大主流浏览器对HTML5特性的支持程度。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"> 综合<span style="color: black;">思虑</span><span style="color: black;">以上</span><span style="color: black;">原因</span><span style="color: black;">选取</span>最佳浏览器进行测试，得出结论:能否满足大屏展示需求。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">1.4. 专业术语</p>
<span style="color: black;">详细</span>含义HTML5超文本标记语言，以下简<span style="color: black;">叫作</span> Html5FPS每秒页面刷新的帧数，<span style="color: black;">小于</span> 24 帧/秒将<span style="color: black;">没</span>法<span style="color: black;">表示</span>动画效果<h2 style="color: black; text-align: left; margin-bottom: 10px;">2. 测试环境</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">为了<span style="color: black;">保准</span>测试结果的有效性，结合现有的硬件资源，<span style="color: black;">选择</span>三台<span style="color: black;">设备</span><span style="color: black;">做为</span><span style="color: black;">这次</span>测试的硬件</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">环境，分别<span style="color: black;">包括</span>一台笔记本、一台台式机、一台图形工作站。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">2.1. 笔记本配置</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">类型 规格</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">内存 16GB</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">显卡 NVIDIA GTX1050 4GB</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">CPU INTEL I7-7700HQ 2.8GHZ 4 核心</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">分辨率 1920 x 1080(2K)</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">操作系统 Windows 10 专业版 </p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">2.2. 台式机配置</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">类型 规格</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">内存 32GB</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">显卡 AMD WX5100 8GB</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">CPU INTEL I7-7700 3.6GHZ 4 核心 </p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">分辨率3840 x 2160(4K)</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">操作系统 Windows 10 专业版</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">2.3. 图形工作站配置</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">类型 规格</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">内存 64GB</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">显卡 AMD FirePro W9000 6GB </p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">CPU E5-2643 V4 3.4GHZ 6 核心</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">分辨率 7680 x 3240(8K) </p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">操作系统 Windows 8.1 专业版 </p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;">3. 浏览器选型</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">选取</span>浏览器最<span style="color: black;">重点</span>的是<span style="color: black;">选取</span>浏览器内核，<span style="color: black;">一般</span>所说的浏览器内核<span style="color: black;">指的是</span>渲染引擎 (Rendering Engine)，除此之外，浏览器内核还<span style="color: black;">包括</span>一个非常<span style="color: black;">要紧</span>的部分——脚本(JS) 解析引擎，二者<span style="color: black;">一起</span>决定了网页加载和<span style="color: black;">表示</span>的性能。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">日前</span>主流的浏览器内核有四种，分别是:Trident、Webkit、Gecko、Presto。其<span style="color: black;">表率</span>浏 览器分别为:Microsoft Edge / IE(微软浏览器)、Safari(苹果浏览器) / Chrome(谷 歌浏览器)、Firefox(火狐浏览器)、Opera(欧朋浏览器)。国产浏览器均是基于<span style="color: black;">以上</span>浏 览器内核<span style="color: black;">研发</span>，<span style="color: black;">这次</span>浏览器选型中不<span style="color: black;">思虑</span>国产浏览器。<span style="color: black;">另一</span>，因 Windows10 操作系统并未普 及，<span style="color: black;">这次</span>测试不<span style="color: black;">包括</span> Microsoft Edge 浏览器。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">说明:<span style="color: black;">这次</span>测试<span style="color: black;">运用</span>的浏览器均为当前最新版本。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">3.1. 专业网站测试3.1.1. Html5 兼容性测试</p>以下是 Html5 权威测试网站对各大主流浏览器的测试结果，评分的分值<span style="color: black;">表率</span>了浏览器 对 Html5 特性的支持程度，分值越高兼容性越好，网站<span style="color: black;">位置</span>:<a style="color: black;"><span style="color: black;">http:/</span></a>/<span style="color: black;">html5test.com</span>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">。</p><span style="color: black;">按照</span>该权威网站的测试结果:Chrome57 对 Html5 特性的兼容性最好;其后依次是Opera，Firefox，Edge，Ssfari。IE11 <span style="color: black;">做为</span>最后的 IE 版本，对 Html5 的兼容性<span style="color: black;">仅有</span> 312 分，<span style="color: black;">海量</span>的Html5 新特性在 IE11
回顾过去一年，是艰难的一年；展望未来，是辉煌的一年。 谷歌网站排名优化 http://www.fok120.com/
页:
[1]