我要反馈问题

加入众成翻译官方交流群(群号:362419683)

关注《奇舞周刊》微信号
阅读更多精选前端技术文章

友情链接

猿说:互动氛围更好的IT交流学习平台

互动氛围更好的IT交流学习平台

立即访问
声享:制作精彩的有声幻灯片

使用声享在线PPT快速制作分享优质内容

立即体验

京ICP备17024260号

neck

用 Gatsby 创建一个博客

1032阅读 · neck 2017-11-11翻译  
GraphQL Markdown React API HTML JavaScript

Gatsby 是一个令人难以置信的静态站点生成器,它允许使用React作为渲染引擎引擎来搭建一个静态站点,它真正具有现代web应用程序所期望的所有优点。它通过在构建时通过服务器端渲染将动态的 React 组件呈现为静态 HTML 内容。这意味着您的用户可以获得静态站点...

阿不思

我们要写真正的CSS!

597阅读 · 阿不思 2017-10-28翻译  
CSS JavaScript HTML

我想说这是未来,但我们已经着手实践了。 Rich Harris 2017-09-06 CSS不受欢迎是一个很普遍的现象。导致这一现象的原因有很多,但可以归结为:CSS的不可预测性。如果你在开发中从未有过这种经历:过调试一个样式时,一不小心破坏布局,让一个看起来毫不相关...

夏风

从JavaScript开始吧

342阅读 · 夏风 2017-09-29翻译  
JavaScript HTML DOM API

使用console.log() 引言 所有现代的网页浏览器、NodeJ以及几乎所有其他JavaScript环境都支持使用一套日志记录方法将信息写入控制台中。这些方法中最常用的是console.log()。 在浏览器环境中,console.log()函数主要是调试用的。...

众里寻他千百度

什么是关键 CSS – Smashing 杂志

726阅读 · 众里寻他千百度 2017-09-28翻译  
CSS HTML Node.js

网络速度很慢,但是有一些简单的策略可以使网站变快。其中之一就是 将关键的css内联插入到网页的<head>标签, 但是,如果您的网站包含数百页,甚至更糟糕的是包含数百种不同的模板,那么你该怎么做呢? 你不能手动做这件事。 Dean Hume解释了一个简单的...

myvin

不会写 JavaScript 的人是否还有价值?

2753阅读 · myvin 2017-09-26翻译  
CSS HTML JavaScript Web internet ES6

最近我有幸参加在墨尔本召开的 2017 Web Directions Code 大会。我和 Mark Dalgleish 还有 Glen Maddern (他的演讲非常精彩)被分到了一个演讲小组里。我们做了一系列关于 CSS 的演讲,在小组讨论中,我们讨论了一个问题...

Mactavish

更快地构建 DOM: 使用预解析, async, defer 以及 preload ★ Mozilla Hacks – the Web developer blog

1017阅读 · Mactavish 2017-09-20翻译  
DOM HTML Web

在 2017年,保证我们的页面能够快速加载的手段包括压缩,资源优化到缓存,CDN,代码分割以及 tree shaking 等。 然而,即便你不熟悉上面的这些概念,或者你感到无从下手,你仍然可以通过几个关键字以及精细的代码结构使得你的页面获得巨大的性能提升。 这些新的...

myvin

67 个拯救前端开发者的工具、库和资源

10063阅读 · myvin 2017-09-07翻译  
JavaScript nodejs CSS HTML SVG

在本文中,我不会去谈 React、Angular、Vue 等等这些大的前端框架,也不会谈 Atom、VS code、Sublime 等等这些已经很出名的代码编辑器,我只是想简单的分享一套我认为有助于提升开发者工作流的工具集。 这套工具集中的大部分你可能见过,也可能没...

QAQMiao

101种让你的网站更棒的方法

3491阅读 · QAQMiao 2017-08-30翻译  
Awesome Google HTML

这篇文章最初出版于AwesomeBlog。 上周我和一个老客户聊天,她和我说,“Nick,我觉得我的网站需要改进,但是我却不确定到底需要做什么”。 于是我就去问了周围很多人,朋友、家人和一些非互联网方向的商务人士。他们都说了同样的话: “我需要一个清单,因为我不知...

qgy18

缓存最佳实践及 max-age 注意事项

2075阅读 · qgy18 2017-08-30翻译  
CSS HTML HTTP

使用缓存会带来巨大的性能提升,还能节省带宽、减少服务端开销,但很多网站对缓存一知半解,让相互依赖的资源出现竞态条件,从而无法同步更新。 使用缓存的最佳实践大体上可以归纳为这两种模式: 模式一:不变内容 + 长时间 max-age Cache-Control: max-...

cherryvenus

纯CSS过滤内容

1174阅读 · cherryvenus 2017-08-30翻译  
CSS DOM HTML

纯CSS过滤内容 译者提示: 边看demo边食用,效果更佳 科普一下伪元素:target 仅仅通过CSS过滤内容,这是一个非常有趣且有吸引力的方法。 (译者注:作者在这里是说,他在半夜两点的时候喝了酒,然后突然想做个实践,就是纯CSS过滤内容) 通过CSS的:ta...

betsey

如何使用SVG动画来制作游戏

2189阅读 · betsey 2017-08-30翻译  
CSS SVG HTML

游戏的灵感 在使用过一段时间的SVG动画之后,我相当清楚如何利用它来制作动画片段或者网页布局。一些动画库平台,例如Greensock,和原生的CSS动画简直是绝配。于是我便打算深入地研究一下,看看我能否用这些来制作一款简单的游戏。就像一个精美的工艺品一样,好的游戏拥有...

网络埋伏纪事

React 初学者教程 4: 在 React 中设置样式

2746阅读 · 网络埋伏纪事 2017-08-30翻译  
React CSS HTML

长期以来,我们都是用 CSS 格式化 HTML 内容。用 CSS,可以很好地分离内容和表现形式。CSS 的选择器语法给我们很大的灵活性,来选择哪个要格式化,哪个会略过。你甚至找不到太多的问题来憎恨 CSS 的层叠。 好了,不要告诉 React 这些。React不会积极...

iOSDevLog

所有这些基础的React.js概念都在这里了

2847阅读 · iOSDevLog 2017-08-26翻译  
React JavaScript DOM API HTML React.js Medium Web Form

去年,我写了一本关于学习React.js的简短书,原来是大约100页。今年,我将挑战自己,把它概括为一篇关于中度的文章。 这篇文章不会涵盖什么是React或者为什么你应该学习它。相反,这是对已经熟悉JavaScript并熟悉DOM API基础知识的人们对React...

myvin

JavaScript 包管理的前世今生

1152阅读 · myvin 2017-07-30翻译  
JavaScript NPM Yarn Webpack Node.js HTML CSS

和 Yarn 相比,npm 在缓存、集成度和扩展性方面表现如何呢?我们将在这篇文章中一辨分晓。 使用许可 如果将一个 JavaScript 开发者在 2005 年冰冻起来,然后在 2017 年的现在以某种神奇的方式将其解冻,那么 JavaScript 包的爆炸式繁荣...

camiler

响应式导航模式概述 – Smashing Magazine

865阅读 · camiler 2017-07-07翻译  
Web HTML CSS JavaScript

说响应式web设计改变了我们的行业顶多是一句轻描淡写。过去我们经常会询问客户希望我们支持哪种设备和分辨率,但现在我们知道是“尽可能多的”。为了应对这样的挑战,并处理我们日益复杂的世界,web行业已经爆发出了新的思维,模式和方法。 在这篇文章中,我想主要看一下响应式导航...

is_january

JavaScript & SEO: 让你的机器体验和用户体验一样棒

1569阅读 · is_january 2017-06-26翻译  
Web HTML JavaScript

原文地址:https://moz.com/blog/javascript-seo 作者的观点谨代表其个人(催眠这类不太可能事件不算),而且他的观点也并不总会代表 Moz 的观点(译者注:moz 应为 https://moz.com) 了解 Javascript 以及它...

为之漫笔

411 Length Required:HTTP状态狗

593阅读 · 为之漫笔 2017-06-06翻译  
Web HTML

狗狗帮你理解HTTP响应状态码。 受@girlie_mac的HTTP Status Cats启发 :) 411 Length Required:请求没有指定其内容长度,请求的资源要求必须有这个长度值。 © Copyright 2017.From @mikelee...

明非

HTTP状态狗:301 Moved Permanently

676阅读 · 明非 2017-05-24翻译  
Web HTML

HTTP协议状态码,你永远叫不醒一只装睡的狗狗。 灵感来自于@girlie_mac的HTTP Status Cats 301永久转移:所有的请求都会被转移到新的URI。 © Copyright 2017.From@mikeleeorg....

明非

HTTP状态狗: 300 Multiple Choices

510阅读 · 明非 2017-05-24翻译  
Web HTML

狗狗教你HTTP响应状态码 灵感来自于@girlie_mac的HTTP-状态猫:) 提供多个资源可供客户端选择。例如,它可以用于呈现不同格式的视频,列出不同拓展名的文件,或者消除词语的歧义。 aafromaa拍摄 © Copyright 2017.From@mi...

为之漫笔

HTTP状态狗:226 IM Used

686阅读 · 为之漫笔 2017-05-23翻译  
Web HTML

狗狗帮你理解HTTP响应状态码。 本系列受到了@girlie_mac的HTTP Status Cats的启发 :) 226 IM Used:服务器已经满足了对资源的GET请求,此时的响应表示的是对当前资源实例的一或多个实例级修改的结果。 Photo by Beve...

为之漫笔

HTTP状态狗:208 Already Reported

649阅读 · 为之漫笔 2017-05-23翻译  
Web HTML

HTTP响应状态码,由狗狗本色展示。 本系列受到了@girlie_mac的HTTP Status Cats启发 :) 208 Already Reported:DAV(Distributed Authoring and Versioning)绑定的构成已经在对当前...

为之漫笔

HTTP状态狗:207 Multi-Status

653阅读 · 为之漫笔 2017-05-23翻译  
Web HTML

可爱的狗狗们形象展示HTTP响应状态码。 受@girlie_mac的HTTP Status Cats启发 :) 207 Multi-Status:后面的消息体是XML格式的,根据子请求的数量,可能包含几个独立的响应码。 Photo by GabrielaP93....

为之漫笔

HTTP状态狗:206 Partial Content

633阅读 · 为之漫笔 2017-05-23翻译  
Web HTML

狗狗们现身说法,形象展示HTTP响应状态码。 受@girlie_mac的HTTP Status Cats启发 :) 206 Partial Content:由于客户端发送的范围(range)首部限制,服务器只返回了资源的一部分。范围首部是wget等工具用来实现断点...

为之漫笔

HTTP状态狗:204 No Content

642阅读 · 为之漫笔 2017-05-23翻译  
Web HTML

HTTP响应状态码形象展示,由狗狗们现身说法。 受@girlie_mac的HTTP Status Cats启发 :) 204 No Content:服务器成功处理了请求,但没返回任何内容。 © Copyright 2017.From @mikeleeorg....

为之漫笔

HTTP状态狗:201 Created

608阅读 · 为之漫笔 2017-05-22翻译  
Web HTML

201 Created: 请求已经处理完成,导致创建新资源。 Photo by Beverly & Pack. © Copyright 2017.From @mikeleeorg....

为之漫笔

HTTP状态狗:200 OK

663阅读 · 为之漫笔 2017-05-22翻译  
Web HTML

200 OK: 成功HTTP请求的标准响应。实际的响应取决于使用的请求方法。在GET请求中,响应中会包含与所请求资源对应的一个实体。在POST请求中,响应会包含一个描述或包含动作结果的实体。 Photo by mikeleeorg. © Copyright 201...

winar_阿进

关于渐进增强方法的实例研究:“Building Social”

779阅读 · winar_阿进 2017-01-12翻译  
JavaScript CSS HTML

我们曾激烈讨论过渐进增强的方法以及它是如何提升网站的向下兼容性的。但是怎么样才能将渐进增强的概念应用在一个实际的项目中呢?当我们为网站设计一个复杂的交互效果时,我们很难决定哪些效果仅仅采用HTML和CSS就可以实现,而哪些效果则必须使用JavaScript。 本文我们...

印前

向Web平台添加JavaScript模块

809阅读 · 印前 2016-12-16翻译  
JavaScript HTML Node.js

长期以来,我们一直致力于研究WHATWG标准新特性。我们也一直在试图做件有意义的事情,就是告诉我们的博客读者更多这些新特性。现已经发生了一堆积压已久却令人着实兴奋的事,而我也被提名开始向你讲述关于""的故事。 JavaScript 模块已有很长历史...

scaactk

对无障碍网页应用(ARIA)的选择

1094阅读 · scaactk 2016-12-15翻译  
HTML Developer JavaScript

让网站对每个人都能访问是一件相当艰难的工作,尤其是在我们使用自定义标记解决方案(custom markup solutions)的那些日子。我很高兴#a11y(可访问性的简称)的话题最近获得了越来越多的关注,因为#a11y没有什么好的,但是正如James Willia...

兔兔的奶爸

MaintainableCSS - 一种编写模块化,可扩展和可维护的CSS的方法(作者:Adam Silver):模块

778阅读 · 兔兔的奶爸 2016-12-11翻译  
CSS Product HTML

模块 什么是模块? 模块是不同的、相对独立的单元,它可以与其它的模块组合以构成一个更复杂的结构。 在客厅,你可以认为电视、沙发和墙是模块。他们组合到一起创造了一个可用的客厅。 如果你带走它们其中的一个,剩余的依然可以很好的工作。就像我不需要电视也可以坐在沙发上一样。...

玩命加载中……
已经到底啦