项目代码行数占比

这个项目搞了半年,在半年前开始的时候,我想不知道这次能不能写1w行js,今天有空做了下统计.



php 194783行 46%
html 99304行 24%
css 33429行 8%
js 93998行 22%

跑出结果后,我大吃一惊,原来还是写了很多.

py代码:

testpy

Posted in 代码 | Leave a comment

地方网站的畅想

我在杭州,说起地方网站自然想到的是19楼.

因为这半年来一直和phpwind开发团队配合,对于他们曾经的主营业务(地方网站建站)有了一些了解.

今天下午,是年前最后一个工作日,随手拿起phpwind的社区运营宝典,翻了一遍.看过有一些感悟.

我一直在想能在家乡搞个互联网的东西,也许是十年后吧.一些现实这里要说一下:地方网站基本上是门户+社区,有地方特色.

要有一定的活跃度,有一批忠实会员,定期能搞些结合本地的活动.有那么一些版块还是挺符合商家,网站双赢的模式,比如汽车,家具,母婴,美食,化妆品,票务转让,人们进入社区,来进行购买前的信息收集,售后可以进行评价.其实本质还是可以进行本地购买的物品,又可以和社区紧密结合的交集最适合拿来放到网站上.

本地发生的新鲜事,本地新开的餐馆,最近商场打折信息,转让的火车票,这些信息有的是需要种子用户推动的,有些是用户自己产生的,还有些是商家来发布,社区的管理团队来把关

提起社区的管理团队,这让我想起了曾经西财的门户网站ghy.cn和论坛bbs.ghy.cn.

我们这里有几个管理员和一堆版主,管理员负责招聘版主,素质较为全面,版主们有着每一方面的特别爱好,爱好旅游,摄影,爱好学习(好像有点假),爱好足球,爱好找工作(也有点假).他们在任时负责所在版的内容运营,组织活跃会员搞活动(往往是自费,其实当时完全可以找商家来谈,给他作口碑营销,为版主聚会打折).当他们找工作,考研时,要选定接班人.待革命成功后,要把自己的找工作经验,考研经验分享到论坛,这些宝贵的帖子往往是学弟学妹们获取最有用信息的来源.这种模式在地方网站也同样存在,比如小马终于买车了,他就把自己的购车经验贴上去,顺便给几个商家作下评价.

回到ghy.cn,这里有校园和周边新闻,周边美食,考研学习,出行旅游的信息,这里全都是民间组织 ,没有那么多政策和政治法规宣传因素,所以深受百姓(学生)喜爱.

唯一的遗憾是当时没有做和商家的互动.网站收入最大的好像是一学期的商家广告banner收入,收入形式过于单一.

在06年那会,优惠,打折,返利等模式还市场上还没有流行.我也曾经骑着单车去和校园周边的一个商家拉广告(主要是去商家旁边的饭店吃饭).也曾经和一同学谈做统一的校园周边商家支持的优惠券.而在互联网上搞打折,优惠的事情当时还真是一点没有想过.现在想想,如果那时能把校园周边的优惠,打折信息频道做起来,像淘宝促销频道一样(http://www.taobao.com/go/chn/sale/index2009.php).肯定会在广大群众中,尤其是女生中有很好的口碑.

所以写了上述这些散乱的文字,我想说是很多机会你也许遇到过,不过没有注意过.等后来发现才恍然大悟.

Posted in 产品 | Leave a comment

技术和态度

干这行已经有一年半了。最近周围同事,有个别走了,也有更多的新来的。今天突然我想起一个问题,如何评估一个前端开发人员?我想到这么几个因素:技能,责任心,投入度,做事方法。要在以前我肯定会把技能排到第一位,但是今天,我认为做事方法更重要。

一个需求交给前端去做,用户不会关注他用的什么技术,只有前端自己会去关注。一个前端他做的技术好,用了什么工厂模式,订阅者模式,但是小问题一堆。另一个前端,技术一般把需求的细节完成的很好。在项目团队中,后者肯定是受到赞赏。这和老板给你评估一样的,态度决定命运,态度也决定老板对你的印象。

做为一个团队成员,态度和做事方法是让你能在团队中出众的因素。做事情负责,承诺的时间完成,让别人信任你。做事有方法,讲投入产出,这是你于众不同的地方。说的偏激点,整天搞那些只有行家才看的懂的破代码,团队里的人能知道你的价值吗?

当然以上观点可能稍微有点偏激了

Posted in 互联网 | Leave a comment

也谈客服

今天我在我家乡的航空售票公司-八达航空http://www.badahk.com/上订票回家的机票,杭州到洛阳的50座的小飞机。下了订单后,觉得第一次座这个小飞机还是问问八达航空吧,于是打电话0379-66666666过去了。接线的人是个女生,慢慢的用有点洛阳口音的普通话给我解释着,一点专业的客服职业的感觉都没有,我听她说话觉得很熟悉,像是我初中的女同学。听完后她告诉我这个没问题,都开通一年多的航线了,然后说如果我现在付款,她就等我付钱后把替我把机票出来。

挂了电话,我就去付款了,到了网银这关,总是说我限额不够,没法付。于是我打电话95555过去。那边电话一接,职业客服的感觉就来了。语速不紧不慢,没有感情,还给我说术语,什么时间额度。我问了一会觉得和她浪费时间没意义,就挂了电话。自己琢磨去了。

然后八达航空的那个人打电话过来,说票只有一张了,叫我赶快付,要不就没了。我说了句感谢就很快把钱付了出去。一分钟后,那个八达的mm来电话告诉我票已出,到洛阳机场有什么车坐,问我要不要发票。

我非常满意这次购票过程。回头想来,让我联想到小公司和大公司的差异。

八达航空在洛阳专门销售机票,他提供洛阳到郑州的机场大巴,送票业务。洛阳市个个区基本上都有它的网点。服务好,信誉好。人们说买机票,在洛阳这种网络不发达的城市,很少有人会用网上订票,人们首先想到的是八达航空买机票。

任何东西都有它存在的理由,八达航空在洛阳这二十多年来,随着民航事业的发展,他的生意逐渐在扩大。但依然还是个服务于洛阳,网点只有5,6个的小公司,他的员工我想不会超过40个吧。我在他网站上的订单号是2000多,也就说明他这个网站目前只接了2000多个线上订单。2000订单相比大的网站来说,也就是十几分钟的事情。

公司小的时候,因为领导人一人发号施令,事必躬亲,可以做的不错。

公司大了,人多了,流程多了,有的员工抱着是不关己,这个客户无所谓,反正我们那么多客户呢这种心态工作,也就会出现上面网银客户的现象了。小公司,客户不多,每一个客户都是他们宝贵的收入来源。

人之初性本善

人之将死,其言也善

有的大公司再不重视客户,再自以为是,它就离死不远了

Posted in 互联网 | Leave a comment

小试clickheat

clickheat是一款页面点击分布插件.他比起其他页面点击分布插件的好处是

可以可视化生成页面热图.

这是今天测试的life.alipay.com首页热图.

他唯一不好的地方是这个东西太慢,没点一次就发送一个请求.把点击的坐标发送x,y值记录下来.

Posted in 代码 | Leave a comment

静态文件打包遇到的问题

我们常将静态文件合并

如将样式1.css,2.css合并为pub.css

因为1.css文件开头制定了@charset “utf-8″; 所以两个文件合并后pub.css里面就会有下面代码

.box{}@charset “utf-8″;.l-clear{height:10px;}

这里就出现问题了,一个样式文件中又制定了编码.会引起编码后面这段.l-clear在safari,mac的firefox下都失效.

Posted in 代码 | Leave a comment

拖拽模块

曾经有个项目要做页面区域拖拽功能,像百度自定义首页一样

功能点:

1.拖拽区域到制定位置,然后插入区域放到被插入区域的前一个节点

2.如果用户不登录,就也能记录上次的位置.

开始做时没思路,就看了这个很多类似网站,不过最好的还是这家的http://www.netvibes.com/.

有几点比较重要记录下来:

1.建立每个拖拽对象new Drag,这里就像mootools

曾经有个项目要做页面区域拖拽功能,像百度自定义首页一样

功能点:

1.拖拽区域到制定位置,然后插入区域放到被插入区域的前一个节点

2.如果用户不登录,就也能记录上次的位置.

开始做时没思路,就看了这个很多类似网站,不过最好的还是这家的http://www.netvibes.com/.

有几点比较重要记录下来:

1.建立每个拖拽对象new Drag,这里就像mootools里面的drag,他的结构也是有onstart,ondrag,oncomplete等.再给每个方法添加了自定义事件.在这个基础上写一个drag的扩展,用来根据具体的页面业务添加独特的事件.比如oncomplete时怎么办,ondrag时怎么办?

2.cookie的使用,因为记录每个模块的坐标要写到cookie里面,做到后来发现cookie太大了,yslow里面直接把reduce cookie size打成了F.作到这也没法改了,以后注意.慎用cookie.

Posted in 代码 | Leave a comment

框架里js功能的扩展

刚做前端是,开发是搞java的,一年过去了对没太多感觉,前后端分离做的相当的好,我看java代码的次数还没在学校多。
现在换部门了,项目是php的,搞了正好半年,深深的喜欢php,开始自己搞搞php,搭个某某东西出来。
开始为了好玩,兴趣。直到有一天我突然发现,js框架里面的东西很多和php语句很像。我专门开始花时间研究。

有人说php比asp好用,是因为他内置了很多函数。其实我们使用js框架也是一样,我们在用他的内置函数。方便,快捷。
我们都知道php出道时间比js框架早,05年那会js框架才慢慢兴起。现在的框架很多定义都模仿了php。比如foreach,或对数组的功能的扩充。这里其实是js框架中的一部分,对js功能的扩充。

一个框架还有几部分(借鉴克军的):
浏览器兼容,dom,event
数据层(ajax等)
交互组建

相对来说,对js功能的扩充还是比较简单的,其他几个都要求对浏览器差异,事件机制有着深入的了解。

Posted in 代码 | Leave a comment

航母建造史

航母建造的历史最显著的一点是航母越造越大,从40年的xxxxx吨,到现在的xxxxxxxxxx吨。以至于后来已经很少有那么大型的船坞来建造这些庞然大物了。分工复杂,建设周期长,一环扣一环是航母建造的特点。
上周看了一篇帖子《Nicholas C. Zakas如何面试前端工程师》,里面前端基本技能这些我觉得没什么说的,是该这样,不过还有一点他没有提出来,这点也是我本文主要阐述的。

模块化,工业化是前端必须要有的意识,如果没有,再好的前端只能是个技师罢了。他再牛逼,也就他一个牛。在大公司,我们做的项目大,时间紧,前端作为ued的最终产出。交付时间点,质量等出现问题都是前端来背的。

回 到航母的建造,如果没有工艺的改进,工程学的提高,航母的设计师设计再大的船也是没法实现的。同样,如果前端工艺不提高,前端开发不采用工业化方法来进 行,我们的设计实现周期会变长,前端的投入产出比会变低。这时你就是再牛逼的前端有什么用?老板还是会觉得不满意。一个人的产出是有极限的,提高团队的产 出,模块化开发才是根本。




具体来说,模块化开发,提高团队产出是:

1.处理需求第一考虑的是他的业务背景,需求所处的环境,他下次会是什么样子。他今后会有哪些变化。了解清楚这些后,你才能确定这个东西是临时的,还是要做成一个模块,它属于的哪个大系统下。
2.带动团队里的每个人都有这样的意识。这里包括视觉,前端,交互,开发。

Posted in 代码 | Leave a comment

静态文件打包和自动时间戳

静态文件是前端开发的根本,和巧妇难为无米之炊一样。它是前端工作的成果载体。
静态文件一直以来是静态存在的,单独的css,js,img。这些都给维护带来了很大的不便。前端有时很讨厌那些静态的零碎的东西,他会引起很多问题。
例如:
1)时间戳:你修改了一个样式文件,涉及到的n多页面,都要把它引用时间戳改掉。如果漏了,发布后,不懂技术的同事就来说样式乱了,页面错位了,这时你只能说,清一下缓存吧。从我做前端开始到现在,每次发布都或多或少遇到这样的额问题。
2)管理零散的样式和脚本文件:前端将设计转化为工业化生产,于是我们就会做组建,做模块,这些零碎的静态资源再组合拼装成我们最终的页面。如何管理这些组建也是需要有个系统来控制,不然全靠手动就乱套了。

面对这种问题,yui产出了yui.loader,实现了在页面上方便快捷的调用组建。

在这第四届D2之前,我在项目中经常遇到发布时,改很多时间戳,组建过多不好管理的问题。于是想办法解决。
这个方法很快就想到了,没多复杂。最终靠着牛逼的韩强同学用python把这个实现了.部署到php环境的项目中,以后再也不用改一次静态文件,就改相关的时间戳了.发布变的轻松很多.能让机器做的事情.干嘛要手动来呢?

下面是这套东西的工作原理:

页面中涉及到的组件很多,比如有4个组件,这四个组件分类有它自己的js和样式,我们有个总控文件来配置这些该页面所有的组件。在本地这些文件是一个个独立引用的。到线上时,我们就从配置文件里把它们找出来打包成一个,再压缩。每次修改一个静态文件,比如样式,js等就自动将涉及到该组件的所有页面静态文件时间戳+1。

具体来说就是这样。

<source var=”address_up” src=”pub/add1.js” version=”1″ type=”js” name=”这是页面address_up.html用到的静态文件”>
<one src=”js/1.js” version=”1″></one>
<one src=”js/2.js” version=”1″></one>
</source>

假设页面里我们用到了两个js文件,js/1.js和js/2.js,这里就是一些拆分的组建。引用时只需要写类似$address_up 就可以在页面中打出
<script src=”js/1.js”></script><script src=”js/2.js”></script>
而在线上环境,这两段js会被合并成一个压缩版的<script src=”pub/add1.js?version=1″></script>
我在本地更改一次js/1.js或js/2.js,打包后的pub/add1.js时间戳就会加1,变为pub/add1.js?verson=2。

这就是打包和自动时间戳的原理。后来参加d2,看见有人说也做了自动时间戳,不知道他们是怎么处理。

Posted in 代码 | Leave a comment