搭建showslow:前端性能跑分及优化工具

综述：showslow是一个开源的工具，集成并通过Yahoo yslow、google page speed、dynaTrace AJAX等工具监测网站各项性能指标，然后通过图表和排名展示出来。

1. 工具软件
   　说明：showslow是典型的linux + apache + php + mysql结构。（当然在windowsmac也可以运行）

我是在Mac Air 上搭建的环境，Mac 跟Linux 搭建步骤差不多啦。

软件准备：

1）mysql和apache软件没有版本要求，去官网下载最新版本即可。我使用的是apache2.4 mysql5.6.24

2）showslow 官网目前最新版本是1.2.2，官网对php的要求是5.3.3。经测试以及n次验证，目前最新5.6.9版本的php，会有兼容性问题，建议使用php5.4.41之前的版本（这是经验，php不要使用超过5.4.41版本。因为showslow1.2.2 php文件数据库扩展和加密扩展的接口方法已经在php5.6.9版本中弃用了，不支持了）。对于php5.3、5.4、5.5、5.6版本的不同，请自行搜索。当然如果精通php，能修改showslow软件里面的php文件相关接口，另当别论。

3）浏览器：准备firefox，以及应用扩展（firebug、yslow、pagespeed）。

2. 环境搭建
   　由于手头只有Mac Air，所以本文档仅适用用Mac和Linux，windows 用户参考即可。

2.1 apache安装
　apache使用2.4版本，编译安装网络上文档太多了，就不描述了。

apache2.4编译安装之前，需要预先安装好apr、apr-util。

cd httpd-2.4
sudo ./configure --with-apr=/path --with-apr-util=/path
sudo make
sudo make install
2.2 mysql安装

mysql安装，参考网络吧。showslow对mysql的版本没有要求。

show slow官网建库和建用户语句：

mysql> create database showslow;
mysql> grant usage on showslow.* to showslowuser@localhost identified by ‘… database-password …’;
mysql> grant all privileges on showslow.* to showslowuser@localhost;
mysql> quit
2.3 php安装
　经过多次验证，php5.4.41版本对于show slow是OK的。(不要使用5.4.41以上的版本，5.5 5.6 版本的php肯定报错）

官网下载地址：http://125.39.35.133/files/21010000065E74D3/cn2.php.net/distributions/php-5.4.41.tar.gz

Mac/Linux编译过程：

sudo CFLAGS="-O3 -fPIC" ./configure --prefix=/usr/local/php --with-mysqli=/usr/local/mysql/bin/mysql_config --with-mysql=/usr/local/mysql --with-apxs2=/usr/local/httpd-2.4.12/bin/apxs --with-libxml-dir=/usr/local/libxml2-2.9.2/ --with-pcre-dir=/usr/local/pcre-8.37/ --with-config-file-path=/etc --with-jpeg-dir --with-png-dir --with-mcrypt --with-mhash --with-curl --with-openssl -enable-mbstring --enable-debug --enable-ftp --enable-zip --enable-exif --enable-sockets --enable-safe-mode
sudo make
sudo make install
说明：

1）php的mysqli、mcrypt、curl、mbstring对于showslow是必需的。

2）在Mac上编译报错：ld:symbol(s) not found for architecture x86_64. clang:error:linker command failed with exit code 1 (use -v to see invocation)。编译的时候增加 CFLAGS="-O3 -fPIC"即可。

编译php后，进入httpd的配置文件httpd.conf 编辑设置：LoadModule php5_module modules/libphp5.so

并增加：

2.4.1 yslow的安装
　 在firefox插件中进行搜索，然后安装即可。主要是配置插件：（firefox地址栏中输入：about:config )

extensions.yslow.beaconUrl = http://localhost/showslow/beacon/yslow/ （作用主要是将yslow的数据传送到本地的showslow数据库中）
extensions.yslow.beaconInfo = grade
extensions.yslow.optinBeacon = true
2.4.2 pagespeed 的安装
　这个插件坑苦我了，怎么也没弄好。其数据无法传送到本地！也记录下相关过程。

1）pagespeed 插件安装教程：http://www.showslow.org/Configuring_Page_Speed

2）showslow的配置文件：config.php 中有个配置：$pageSpeedOnlineAPIKey = ‘’; 这个是调用google pagespeed online api。其安装教程（官网）：http://www.showslow.org/Configuring_Page_Speed_Online_API （哈哈，没看明白，没看明白，按照这个做了，但是数据依然无法传送到本地）

3）上面提到了google pagespeed API，那么这个API key 去哪里找啊？ 嗯，官网申请。 其教程为：http://starrguide.com/pagespeed-online-api-key/

4）show slow pagespeed的功能没弄好，求大神！

2.5 showslow安装

1. 在showslow目录下，复制config.sample.php to config.php

2.修改config.php

$db = ‘showslow’;
$user = ‘showslowuser’;
$pass = ‘… database-password …’;
$host = ‘localhost:/var/lib/mysql/mysql.sock’;
3.执行make .

2.6 其他说明
　　由于我没有windows系统，无法安装dynaTrace rank。

showslow.com官网的截图如下：

2.7 My showslow show:
最后我搭建的show slow环境只有yslow的功能，需要在研究！

最后

以上就是明亮导师为你收集整理的搭建showslow:前端性能跑分及优化工具的全部内容，希望文章能够帮你解决搭建showslow:前端性能跑分及优化工具所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。