罗礼权高级前端开发工程师

  • 个人博客

精通前端,涉猎后端

年工作经验,编写艺术般的代码

  • Javascript

    • 精通原生Javascript,能脱离jQuery等类库编码;
    • 能运用模块化、面向对象的方式编程;
    • 熟悉正则表达式的使用;
    • 开发过功能全面的Javascript基础类库。
  • HTML & CSS

    • 能使用合理的结构和样式编写兼容主流浏览器的页面;
    • 能适当运用CSS 3使页面在现代浏览器上效果更佳;
    • 能熟练运用REM单位实现不同浏览器宽度下的整页缩放;
    • 能熟练使用Chrome开发者工具、Fiddler等工具辅助开发。
  • Node.js

    • 熟悉命令行工具的开发;
    • 熟悉基于Express的Web开发。
  • ASP.NET & ASP

    • 熟悉基于WebForm和ASP.NET MVC的Web开发;
    • 编写过一套简单的基于ADO.NET的ORM类库。
  • SQL

    • 能熟练设计CMS、Blog等中小规模Web应用的数据库;
    • 熟悉SQL Server、MySQL、SQLite的使用;
    • 能编写简单的存储过程和触发器。
  • Photoshop

    • 能进行简单的图片处理和平面设计;
    • 能根据图片特征存成最优的格式。

对Web充满热情

学生时代就踏上了开发之路

2001年9月至2004年6月在广州市第八十六中学就读,课余做了多个小网站,其中以黄埔军校为主题的“黄埔军魂”曾获以下奖项:

  • “第三届全国中小学生电脑制作活动”广州市初赛高中网页二等奖
  • “广州市中学生历史科‘研究性学习’个案征集评比活动”一等奖

2004年9月至2008年6月在华南师范大学修读软件工程专业,通过英语四级考试,取得学士学位。在校期间曾获以下奖项:

  • 2008年5月被评为优秀学生
  • 2007年12月被评为优秀实习生
  • 2007年6月被评为年度优秀校园媒体工作者
  • 2005年4月获班级网页制作大赛一等奖

曾在国内著名互联网公司任职

有大型网站开发、优化经验

现在

广州绽放信息科技有限公司

高级前端开发工程师

前端负责人。搭建了前端的整体架构,包括:

  • 开发前后端中间平台,提升开发效率;
  • 制定静态资源组织策略和代码发布流程;
  • 开发代码构建工具,简化发布操作。

此外,还负责美黛拉手机站、PC网站的开发。

2015/4

广州市千钧网络科技有限公司

高级前端开发工程师

负责JS开发。重新规划了JS代码架构,开发JRaiser 2作为模块化JS的基础,并负责PC视频播放页、视频上传页等核心业务。

此外,还在团队中担任技术导师的角色,经常指导团队成员解决技术难题,并多次在公司内部培训中进行技术分享。

后因公司被搜狐视频收购后,受其过多制约而离职。

2012/9

广州奔步广告设计有限公司

前端开发工程师

主要负责外包网站的开发和维护,偶尔也为业务系统开发团队提供前端协助。

后因平台小、工作技术含量低而离职。

2011/5

广州久邦数码科技有限公司

ASP.NET工程师/前端开发工程师

前期负责ASP.NET开发(因为想转换一下角色),参与了内部流量统计系统和手机门户网站的开发;后期回到前端岗位,负责Hybird App内嵌页面的开发。

后因上班路程太远、加班太多而离职。

2010/11

广州网易信息科技有限公司

页面工程师

第一份正职工作,初期只负责专题页面的制作。后来转为负责JS开发,编写了基础库与UI组件,并负责网易跟贴和内部CMS等重要项目。

后因网站部搬迁到北京而离职。

2008/5
2007/9

动网先锋网络科技有限公司

ASP技术员(实习)

大三暑假时的实习工作。前期负责动网论坛定制业务(主要为UI和插件的定制),后期参与了JScript版动网论坛的开发。

实习三个月后离职。

2007/7

丰富的项目经验

业余项目与公司项目相互促进

JRaiser

  • Javascript
  • Node.js

2008/2 至今

1.x版是仿jQuery开发的基础库和UI库,曾用于网易门户网站,已停止维护。

2.x版是基于CMD规范的模块化类库,包含加载器和一些通用性较强的基础模块UI组件。此外还有配套的CLI工具,用于构建代码生成API文档。先后应用于56网及美黛拉Web端产品。

Javascript类库JRaiser

美黛拉手机站

  • HTML 5
  • CSS 3
  • Javascript
  • Node.js

2015/4 至今

兼容主流移动浏览器及Webkit内核的PC浏览器。在微信中打开时会调用微信JSSDK的接口,在美黛拉APP中打开时会调用APP提供的接口。核心页面包括:

  • 商品索引页:可以通过各种过滤条件搜索商品。过滤条件通过HTML5历史记录接口记录在URL参数中,即使页面刷新也不会丢失。
  • 下单页:本页的业务流程有多个可选的子步骤,且数据交互逻辑较多,因此使用Vue进行开发。
美黛拉H5站

Back2Front

  • Node.js

2015/4 至今

基于Express开发的前后端中间平台,工作原理是请求(HTTP GET)后端API获取数据,并通过XTemplate模板引擎渲染为HTML返回到浏览器。由于XTemplate也可以在浏览器端运行,所以还实现了前后端模板共用

该系统应用于美黛拉所有Web端产品,在服务器上通过PM2运行。

前端代码构建工具

  • Node.js

2015/4 至今

基于Gulp开发的代码构建命令行工具,构建流程包括:

  • 替换资源引用地址中的主机名为对应环境(测试环境、预发布环境或生产环境)的主机名;
  • 压缩代码;
  • 替换纯文本文件的换行符为LF;
  • 在文件名中添加MD5戳并替换对应的引用路径。

56网HTML5视频上传

  • HTML 5
  • Javascript

2013/3 至 2015/2

通过XMLHttpRequest 2.0实现支持PC现代浏览器、移动浏览器的视频上传,且能实时显示上传进度和速度。

后来进一步改良为断点续传,通过File类的slice方法把文件分块上传,并把上传进度记录在localStorage中。一旦上传中断,短时间内再上传同一个文件可以续传。

56网HTML5视频上传

56网PC视频播放页

  • HTML
  • CSS
  • Javascript

2012/11 至 2015/2

用户观看视频的主页面。因为页面有CDN缓存,所以大部分动态内容要通过JS加载。为了提高性能,采用了延迟加载延迟渲染事件代理等优化方式。

此外,还通过监听页面的window.onerror事件对异常信息进行采集,以便及时发现和排查故障。

56网PC视频播放页

LetsBlog

  • Node.js
  • MySQL

2015/1 至今

为建立个人博客而开发的博客发布系统(上一版基于ASP.NET+SQLite开发),基于Express框架开发,页面由XTemplate模板引擎渲染,目前通过iisnode运行于IIS服务器上。

前端方面,应用了媒体查询字体图标等技术,能适配各种设备。

LetsBlog

UADetector

  • Node.js

2014/10 至今

分析浏览器Useragent的程序包,能识别出浏览器、浏览器核心、操作系统和设备品牌,识别方式主要是正则表达式匹配。开发过程中通过56网流量统计系统收集到的大量日志不断提高匹配度。

用于56网内部Useragent分析统计。

UADetector

GO比分

  • HTML 5
  • CSS 3
  • Javascript

2011/2 至 2011/5

展示各类体育球赛信息的手机客户端,支持多国语言

界面主要为嵌入到客户端的网页;客户端提供缓存、通知栏等接口供网页端调用。

GO比分

网易可视化专题模版系统

  • Javascript

2010/1 至 2010/10

为网易门户网站常规专题制作而开发的辅助系统,可以在所见即所得的界面中,通过组合模块快速创建专题页面。

系统中的每个模块有两套模板:前端模板与后端模板。前者用于在编辑界面中渲染HTML,实现所见即所得;后者才是真正生成的代码。

专题页面的布局与模块组合形式以JSON格式存储,并以模板注释的形式保存在最终生成的页面代码中,以便下次编辑时直接加载。

网易跟贴

  • XHTML
  • CSS
  • Javascript

2009/2 至 2010/9

重写网易跟贴的前端架构,使用JSON数据配合前端模板的方式渲染跟贴,大大提高代码的可维护性。

网易跟贴