前言

Web前端开发这个日新月异的时代,总是需要阅读一些最新的英文技术博客来跟上技术的发展的潮流。而有时候会遇到一些比较高频的“黑话”,在社区里面可能已经是人人皆知的“共同语言”,而你接触的少就偏偏看不懂。就像现在几乎所有中国人都知道duang是什么东西,但是一个刚学中文的外国人看到以后可能就一头雾水。

黑话也是要学习的,本文收集各种Web开发的黑话。这里先介绍两个。

Polyfill

Polyfill或者Polyfiller,是英国Web开发者 Remy Sharp 在咖啡店蹲坑的时候拍脑袋造出来的。当时他想用一个词来形容"用JavaScript(或者Flash之类的什么鬼)来实现一些浏览器不支持的原生API"。Shim这个已经有的词汇第一时间出现在他的脑海里。但是他回头想了一下Shim一般有自己的API,而不是单纯实现原生不支持的API。苦思冥想一直想不到合适的单词,于是他一怒之下造了一个单词Polyfill。除了他自己用这个词以外,他还给其他开发者用。随着他在各种Web会议演讲和他写的书《Introducing HTML5》中频繁提到这个词,大家用了都觉得很好,就一起来用。

Polyfill的准确意思为:用于实现浏览器并不支持的原生API的代码。

例如,querySelectorAll是很多现代浏览器都支持的原生Web API,但是有些古老的浏览器并不支持,那么假设有人写了库,只要用了这个库, 你就可以在古老的浏览器里面使用document.querySelectorAll,使用方法跟现代浏览器原生API无异。那么这个库就可以称为Polyfill或者Polyfiller。
好,那么问题就来了。jQuery是不是一个Polyfill?答案是No。因为它并不是实现一些标准的原生API,而是封装了自己API。一个Polyfill是抹平新老浏览器 标准原生API 之间的差距的一种封装,而不是实现自己的API。
已有的一些Polyfill,如 Polymer 是让旧的浏览器也能用上 HTML5 Web Component 的一个Polyfill。FlashCanvas是用Flash实现的可以让不支持Canvas API的浏览器也能用上Canvas的Polyfill。

Shim和Polyfill

在JavaScript的世界里,有两个词经常被提到,shim和polyfill.它们指的都是什么,又有什么区别?

一个shim是一个库,它将一个新的API引入到一个旧的环境中,而且仅靠旧环境中已有的手段实现

一个polyfill就是一个用在浏览器API上的shim.我们通常的做法是先检查当前浏览器是否支持某个API,如果不支持的话就加载对应的polyfill.然后新旧浏览器就都可以使用这个API了.术语polyfill来自于一个家装产品Polyfilla:
Polyfilla是一个英国产品,在美国称之为Spackling Paste(译者注:刮墙的,在中国称为腻子).

记住这一点就行:把旧的浏览器想象成为一面有了裂缝的墙.这些[polyfills]会帮助我们把这面墙的裂缝抹平,还我们一个更好的光滑的墙壁(浏览器)

Paul Irish发布过一个Polyfills的总结页面“HTML5 Cross Browser Polyfills”.es5-shim是一个shim(而不是polyfill)的例子,它在ECMAScript 3的引擎上实现了ECMAScript 5的新特性,而且在Node.js上和在浏览器上有完全相同的表现(译者注:因为它能在Node.js上使用,不光浏览器上,所以它不是polyfill).

 

前端“黑话”polyfill的更多相关文章

  1. shim和polyfill,前端术语

    最近项目临近发布,JS的bug大都修改完毕,终于进入了我在这家公司实习+入职为数不多的摸鱼时刻.(想想真是有点感人啊) 因为项目要兼容IE8,所以我们的代码里常常要用到 shim 以支持ES5 的相关 ...

  2. 前端专业术语: shim 和 Polyfill,了解下

    在学习和使用 JavaScript 的时候,我们会经常碰到两个术语:shim 和 polyfill.它们有许多定义和解释,意思相近又有差异. Shim Shim 指的是在一个旧的环境中模拟出一个新 A ...

  3. Vue.js:轻量高效的前端组件化方案

    转发一篇尤老师对vue.js的介绍,了解vue.js的来龙去脉.不过现在已经是2.0了,也有添加一些新的东西,当然有些东西也改了. Vue.js:轻量高效的前端组件化方案 Vue.js 是我在2014 ...

  4. 前端知识杂烩(HTML[5]?+CSS篇)

    1. CSS 优先级算法如何计算?2.如何居中div?如何居中一个浮动元素?如何让绝对定位的div居中?3.用纯CSS创建一个三角形的原理是什么?4. 如何解决inline-block元素的空白间距( ...

  5. js/jquery/html前端开发常用到代码片段

    1.IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条件注释只能用于IE5以上,IE ...

  6. Web前端学习过程

    推荐学习网站www.freecodecamp.cn http://www.w3school.com.cn/ 步骤: 作者:张帅 知乎链接:https://www.zhihu.com/question/ ...

  7. Vue.js:轻量高效的前端组件化方案(转载)

    摘要:Vue.js通过简洁的API提供高效的数据绑定和灵活的组件系统.在前端纷繁复杂的生态中,Vue.js有幸受到一定程度的关注,目前在GitHub上已经有5000+的star.本文将从各方面对Vue ...

  8. 各式 Web 前端開發工具整理

    程式碼編寫工具 (Coding Tools) 工作流程/建置/組合 (Workflow/Builds/Assemblers) lumbar brunch grunt lineman yeoman Ta ...

  9. 思考 ”前端开发人员都在关注的 GitHub 资源“

    点这里 原文: 资源 免费的计算机编程类中文书籍 免费编程书籍 计算机科学论文 codeparkshare Python初学者书籍.视频.资料.社区推荐 Python资料汇总 app应用推荐 码农周刊 ...

随机推荐

  1. python3下获取全局坐标

    前段时间自己想用python写一个关于截屏翻译的小功能,所以首先需要获取鼠标的坐标动作有按下.拖拽.释放.查找了很多资料无非是pyhook或者用其他语言重写.但是自己用的是python3.65,第三方 ...

  2. 分布式ID方案有哪些以及各自的优劣势,我们当如何选择

    作者介绍 段同海,就职于达达基础架构团队,主要参与达达分布式ID生成系统,日志采集系统等中间件研发工作. 背景 在分布式系统中,经常需要对大量的数据.消息.http请求等进行唯一标识,例如:在分布式系 ...

  3. mysql 数据库导入导出方法总结

    一般形式:mysqldump -h IP -u 用户名 -p 数据库名 > 导出的文件名 (1)-p 后面不能加password,只能单独输入如1中那样 (2)mysqldump是在cmd下的命 ...

  4. Linux内核基本装载卸载

    Linux由两部分组成:内核核心+内核模块核心的命名通常是vmlinuz-VERSION-release,模块的放置于/lib/modules/VERSION-release/ 一旦系统运行起来,内核 ...

  5. 调用Excel宏批量处理文件

    '1.用户可以任意选择文件夹进行遍历 '2.限定遍历时仅搜索EXCEL文件(你可以改变文件类型) '这个程序要先在“引用”下选择"microsoft scripting runtime&qu ...

  6. 【机器学习】异常检测算法(I)

    在给定的数据集,我们假设数据是正常的 ,现在需要知道新给的数据Xtest中不属于该组数据的几率p(X). 异常检测主要用来识别欺骗,例如通过之前的数据来识别新一次的数据是否存在异常,比如根据一个用户以 ...

  7. HttpWebRequest请求Https协议的WebApi

    public static class RequestClient { /// <summary> /// 参数列表转为string /// </summary> /// &l ...

  8. jsp中的四个作用域,九个内置对象分别是什么?

    九大内置对象: 内置对象(又叫隐含对象),就是在jsp中,不需要创建(由服务器<容器>来创建),可以直接使用的对象. 对象 含义 类 作用域 request 请求对象 类型 javax.s ...

  9. 464. Can I Win

    https://leetcode.com/problems/can-i-win/description/ In the "100 game," two players take t ...

  10. Mac 系统搭建ThinkPHP3.2

    PHP3.2完整包目录 拷贝两个文件 index.php 和ThinkPHP目录到服务器目录中,我已经设置服务器目录与eclipse工作空间为同一个 创建TestThinkPHP 项目 Eclipse ...