Archives for 系统架构

关于JS——架构的设计

随着web技术的发展,web2.0开始成为主流,JS在整个系统中的地位越来越重要,而对于JS的优化和架构的建立也越来越受到重视。
一、为自己的系统选择一个合适的框架
prototype和Jquery都是很好的框架。

prototype是一个完全存在于底层的代码,他优化了JS的面向对象的扩展,封装了DOM操作API,很好的处理了事件,AJAX等,体积也很小。要说他的缺点,恐怕就是它本身并没有实现太多的功能。
JQuery,本身实现了很多特效,能帮助工程师完成很多工作,即便是工程师对JS并不那么熟悉。它很重视代码的简介与高效。是一个很不错的库类,鼎鼎大名的YUI都复用了很多他的代码。

选好了一个框架,之后就应该要求工程师按照框架的要求去进行开发。否则,这个框架的选择还有什么意义呢。
二、不要把只有单独的子项目才会使用的JS放在全站都会引用的.js文件里
这个几乎是毋庸置疑的。但是有时候我们需要去减少一张页面的JS文件请求数,这时候我们通常会把子类的代码直接放在基类的文件中,然后随着项目的增多,继承该基类的子类也增多,我们在下载页面的时候需要去加载的无关代码量也开始增大。于是我们在控制JS文件请求数的同时也要考虑到,我们应该如何去规划JS的目录结构。
通常我们把js放在www的js目录下或者是将站点的所有静态文件都放于http://static.yourdomain.com,其中js文件的目录是http://static.yourdomain.com/js。
而我们通常把一些全站都会用到的函数,或者一些简单的极其常用的基类定义在一个类似于global.js的文件里,然后把其他的一些跨应用的基类放在以类名为文件里并放在class/目录下,如class/ajaxlist.js,这个文件是处理ajax下生成和操作数据列表的类的代码。而对不同应用则应该有一个文件是对这些基类的实例化和逻辑处理的相关代码便放在属于他们自己的文件里然后存放于app目录,比如app/album.js是关于相册的代码。
于是,我们的HTML里面应该是这样的。

<script src="http://static.yourdomain.com/js/prototype.js?124"></script>
<script src="http://static.yourdomain.com/js/global.js?326"></script>
<script src="http://static.yourdomain.com/js/class/ajaxlist.js?178"></script>
<script src="http://static.yourdomain.com/js/app/album.js?768"></script>

而这样的代码是很符合优化策略的
三、在HTML里为你的JS加上版本号
这是很必要的。这将利用浏览器的缓存或SQUID等来减少浏览器像服务器进行请求的次数,也将节省用户的下载时间。只要版本号不变化,浏览器就不会重新下载。
四、在用户操作前为用户做好准备工作
有一些过度的结构化的代码反而会造成负担。特别是在IE的JS执行效率还不算很高的现在看来。有时候用服务器端去处理那些没必要交给JS的数据,将完整的初始状态留给用户对用户来说可能是更好的体验。

PHP的MVC

PHP的面向对象的特性越来越完善使得,PHP能够更好的从代码结构上进行系统的封装。当一个系统,其中有大量的逻辑存在与流程控制之中,MVC的优势就开始渐渐体现。
MVC的模式要求对系统的总体结构在逻辑上分成三部分

View(界面/视图):用户界面,网页模板
Controller(控制/流程):系统业务流程
Model(模型/逻辑):系统设计中的一些基础类和数据操作

拿一个简单的登陆流程当例子
最常见的登陆流程是这样的,我们假设我们的网站根目录下有一个叫做/user的文件夹来存放所有与用户操作相关的页面,其中有一个页面是/user/login.php。而我们的根目录上有文件/index.php作为网站的首页。当我们打开/index.php的时候进行判断,如果未登陆则跳转到/user/login.php进行登陆,如果成功则跳回/index.php,否则跳到/error.php。
流程图如下:

根据文字和流程图的描述,我们可以开始编码了。
/index.php

< ?php
//…
$userLib = new userLib();
if (!$userLib->chkLogin()) header(’location: /user/login.php’);
//…
?>

/user/login.php

< ?php
//…
if (isset($_POST[’submit’])) {
$userLib = new userLib();
$succ = $userLib->login($_POST[’name’], $_POST[’pass’]);
header(’location: ‘.($succ?’/index.php’:'/error.php’));
}
$tpl = new Template();
$tpl->show(’user_login.tpl’);
?>

/error.php

< ?php
$tpl = new Template();
$tpl->show(’error.tpl’);
?>

关于Controller
就像上面三段程序就是系统中的controller,他们并不执行什么具体的操作也不输出,只是不断调用Model中的不同方法来处理逻辑。
关于Model
Model则是另一个重要的话题,那便是在PHP中如何更好的类封装。但是在这里我们看到的在/user/login.php中被使用的userLib类和Template类都是系统中的model,他们处理具体的数据操作,并返回值来用controller使用。
从PHP5开始,我们有了接口,从PHP5.3开始,虽然还没有Release,我们有了namespace,PHP真正面向对象的时代已经到来了。这时候我们已经没有必要再去讨论我们应该把userLib写成userLib.function.php还是userLib.class.php,我们要做的只是更好的封装和理解各model之间的从属逻辑结构。更好的设计model中的各个库来保障系统的运行效率和维护效率。
关于View
View的部分往往被看作是前段设计人员的工作,但是作为PHP的程序员也必须关注这一话题。
对于view和controller来说,所有的页面都是围绕着流程来产生的。而controller有时也担负着处理页面与页面之间相互传递的工作。我们要确定页面的元素,特别是表单元素,并通过表单元素来处理用户提交的数据,其次我们还要确定PHP传递给模板的变量,然后才能交付给设计人员。
最后
我们还经常用来一些常用的文件夹名和文件名来暗示程序的阅读者,特别是新的阅读者,该文件夹或文件的作用。这也是相当重要的。