前端优化不完全指南

1 工作效率

你是否经常处于这样的场景:从早上忙到晚上八九点,一会与产品经理沟通,一会在部门群聊一下新奇的东西,一会被设计美眉纠缠住拖不了身,有时还开不了部门的会议因为页面急着上线,然后继续加班~~~

怎么提高我们的工作效率?下面从四个方面讲解:

  • 时间管理
  • 利用工具
  • 经验和阅历
  • 使用新技术

前端开发工程化探讨

a0003048-9fda-4716-ac4e-4fcedaba73ad

喂喂喂,那个切图的,把页面写好就发给研发工程师套模板吧。

你好,切图仔。

不知道你的团队如何定义前端开发,据我所知,时至今日仍然有很多团队会把前端开发归类为产品或者设计岗位,虽然身份之争多少有些无谓,但我对这种偏见还是心存芥蒂,酝酿了许久,决定写一个系列的文章,试着从工程的角度系统的介绍一下我对前端,尤其是Web前端的理解。

只要我们还把自己的工作看作为一项软件开发活动,那么我相信读过下面的内容你也一定会有所共鸣。

浅谈前端集成解决方案

每个前端团队都在打造自己的前端开发体系,这通常是一个东拼西凑,逐渐磨合的过程,在技术发展日新月异的今天,这样的过程真的是不可抽象和复制的么?本文希望能够通过系统的拆解前端开发体系为大家提供体系设计思路参考。

什么是前端集成解决方案

前端集成解决方案,英文翻译为 Front-end Integrated Solution,缩写fis,发音[fɪs]

前端集成解决方案并不是一个新词汇,将这个词拆开来看,我们能得到:

  • 前端:指前端领域,即web研发中常用的浏览器客户端相关技术,比如html、js、css等
  • 集成:将一些孤立的事物或元素通过某种方式改变原有的分散状态集中在一起,产生联系,从而构成一个有机整体的过程。[1]
  • 解决方案:针对某些已经体现出的,或者可以预期的问题,不足,缺陷,需求等等,所提出的一个解决问题的方案,同时能够确保加以有效的执行。[2]

专为控制打印设计的CSS样式

大多数Web设计师对打印控制还不是很熟悉,他们往往更迷恋像素,而不是打印机。在现实世界中,很多人依赖从网站上打印网页来参考: 在这个数字时代, 在一些特殊的场合,很多人手中还会拿着纸张。
Web开发人员可以采取一些措施来弥补打印机和液晶屏之间的差距.

gulp前端工具的使用教程

前端的不断深入,除了知识面的拓展,还有就是各种工具的折腾,找到合适自己团队的工具,提升工作效率,对一个团队来说才是最实际的。

但是前端的构建工具最近很hot,出现了很多选择,出名的有各大团队开发的,比如grunt、fis和本文的gulp。

构建工具,这个词看起来高大上,其实就是把我们日常重复繁琐的工作,通过一个node开发的工具和几行命令来实现,比如less编译,sass编译、js和css压缩、雪碧图合并、项目打包、图片压缩等等功能。还是很实用的,至于说哪个工具最好,这个很难说,要看团队的习惯和项目的内容,建议每个都去折腾一下,用过了才知道哪个适合。

CSS字体单位: em、rem与px、pt

之前在面试中,被问到css字体单位的问题,总结一下字体单位的相关知识,方便以后查看。

CSS中,长度单位有两种,分别是绝对长度单位和相对长度单位。

绝对长度单位 

绝对长度单位分为in(英寸)、cm(厘米)、mm(毫米)、pt(磅)、pc(pica)。其中,in(英寸)、cm(厘米)、mm(毫米)和实际中常用的单位完全相同。重点介绍一下pt(磅)、pc(pica)。

pt(磅):是标准印刷上常用的单位,72pt的长度为1英寸。
pc(pica):这也是一个印刷上用的单位,1pc的长度为12磅。

绝对长度单位,虽然理解起来很容易,但是在网页的设计中很少用到。

语法图 Syntax diagrams

最近看了一本关于js的书,很多使用的是语法图,在此将网上不多关于语法图的资料收集起来。

语法图(Syntax diagrams )又叫铁路图(railroad diagrams)是描述形式文法的一种方式。它是巴科斯范式或扩展巴科斯范式的图形化表示。最早使用语法图的书包括Niklaus Wirth写的“Pascal User Manual”(语法图开始于47页)和the Burroughs CANDE manual。在编译领域,像BNF和它的变体这样的文字式表示法都是首选的。BNF能很好的被编译器作者和编译器理解,但是不能很好的被这些语言的大部分用户理解。铁路图能更容易被大多数人理解。数据交换格式JSON之所以流行的部分原因就是它用铁路图来表示。 

PC端大型单页式商业内容管理系统的JS模块化构建探索

前提

为了不被喷得太惨,给标题加了这么多的限制定语也是相当不容易的了。此文讨论的是我所处的环境下对JavaScript构建的一些简单探索,因此有相当多的前提限制。

首先,何为大型。从我们的系统来看,20多个业务模块,近100个页面组成的单页系统,对应的业务源码代码量如下:

src