网络埋伏纪事 发布于 05月19, 2017

【译】浏览器前端优化

原文:http://www.zcfy.cc/article/2847

优化全都是与速度和满意度有关。

  • 从用户体验的角度,我们希望前端提供可以快速加载和执行的网页。

  • 而从开发者体验的角度,我们希望前端是快速、简单而规范的。

这不仅会给我们带来快乐的用户和快乐的开发者,而且由于 Google 偏向于优化,SEO 排名也会显著提高。

如果你已经花费了大量时间来改善你网站的 Google Pagespeed Insights分数,那么这将有助于揭示这一切实际上意味着什么,以及我们必须为优化前端所采取的大量策略。

阅读全文 »

网络埋伏纪事 发布于 05月15, 2017

CSS 中的可视化格式模型基础 - CSS 中的布局基础

译者按:本文翻译自 Eric Meyer 的 CSS 权威指南第四版。

内容:

  • 学习元素盒类型详情,包括 block、inline、inline-block、list-item、run-in 盒
  • 改变元素生成的盒子类型,从 block 到 inline,或者从 list-item 到 inline
  • 深入水平和垂直块盒格式化的复杂性
  • 探索行内布局的核心概念:匿名文本、em 盒、内容区、leading、行内盒 和行盒
  • 理解可替换和非可替换行内元素的格式化区别。

概述: 本书主要讲解 CSS 中的可视化渲染的理论部分。为什么用整本书来写可视化渲染的理论基础呢?答案是,作为一个 CSS 内包含的如此开放和强大的模型,在一本书中想要涵盖属性和效果的每一种可能的组合方式是不可能的。很明显,我们会在使用 CSS 时发现更多的新方式。在探索 CSS 的课程中,你会遇到浏览器中看似奇怪的行为。在深入理解可视化渲染模型如何在 CSS 中起作用后,你才能判断一种行为是否是 CSS 定义的渲染引擎的正确结果(如果意外),或者是否是无意中发现的一个需要报告的 bug。

阅读全文 »

网络埋伏纪事 发布于 05月15, 2017

CSS 可视化格式模型概述

译者按:可视化格式模型可以说是 CSS 规范中最最重要的一部分。要精通 CSS 布局,这一部分内容必须掌握透彻。个人认为 CSS 高手和菜鸟的区别就在于:在布局时,菜鸟在布局时候用什么属性基本都是很盲目,随意下手,出现问题就去网上找解决方案或者瞎试,就算最后解决了,也不知道为什么,下次依然会犯错;而熟悉规范这部分的高手写一个属性就知道会对其它部分产生什么影响,所以犯错会很少,开发效率也高。

本文是 CSS Mastery 第三版的第三章的翻译。


浮动、定位和盒模型是需要掌握的一些最重要的 CSS 概念。这些概念控制了元素在页面上安排和显示的方式,并形成了很多布局技术的基础。最近,专门设计用来控制布局的新标准已经提出了,我们会在之后的章节中分别看到这些标准。不过,本章所学的概念会帮助你完全掌握盒模型的难点、绝对定位和相对定位之间的区别、以及浮动和清除浮动的工作原理。一旦牢固掌握了这些基础知识,使用 CSS 开发网站就会变得容易得多。本章中将学习如下内容:

  • 盒模型的难点
  • 外边距如何折叠以及为什么会折叠
  • 不同的定位属性和值
  • 浮动和清除的工作机制
  • 什么是格式化上下文

阅读全文 »

网络埋伏纪事 发布于 05月08, 2017

【译】组合软件:6. 函子和范畴

原文:http://www.zcfy.cc/article/2698

一个函子(Functor)是可以映射的某个事物。也就是说,函子是一个带有接口的容器,这个接口可以用于将一个函数应用到容器内的值。看到函子(functor)这个词时,就应该想到可映射

术语函子来自范畴论。在范畴论中,函子是范畴之间的映射。粗略地讲,范畴(Category)是一组事物,这里每个事物都可以是任何值。在代码中,函子有时候被表示为一个带有 .map() 方法的对象,这个 .map() 方法用来将一组值映射为另一组值。

函子为其内部的零到多个事物提供了一个盒子,以及一个映射接口。数组就是函子的一个不错的例子,但是很多其它类型的对象也可以被映射,包括单值对象、流、树、对象等等。

对集合(数组、流等)而言,.map() 通常会遍历集合,并且将指定函数应用到集合中的每个值,但是并非所有函子都可以迭代。

阅读全文 »

网络埋伏纪事 发布于 05月05, 2017

【译】组合软件:5. Reduce

原文:http://www.zcfy.cc/article/2697

Reduce(亦称:fold、accumulate,译为归纳)实用程序通常用于函数式编程中,让我们可以遍历一个列表,将一个函数应用到一个累加的值以及列表中的下一个条目,直到迭代完成,并且返回累加值。用 reduce 可以实现很多有用的东西。如果要在一个条目集合上执行一些重要的处理,那么 reduce 就是最优雅的方式。

阅读全文 »

网络埋伏纪事 发布于 05月05, 2017

【译】组合软件:3. 函数式程序员的 JavaScript 介绍

原文:http://www.zcfy.cc/article/2695

对于不熟悉 JavaScript 或者 ES6+ 的人来说,本文的目的是做一个简单介绍。不管你是初学者,还是有经验的 JavaScript 开发者,都可以学到一些新东西。如下的内容只是蜻蜓点水,让你兴奋起来。如果想了解更多,就必须更深层次探索了。后面还有更多东西。

阅读全文 »