20180125 前端开发日报

前端特效05:绝对震撼的16行JS代码实现地球自转效果;js深入学习绕不开的原型知识;了不起的 Gatsby.js;前端工程师的未来在哪里?;vue无缝滚动;从 18000 篇中脱颖而出的 45 个最棒的 React.js 学习指南(2018 版);16年毕业的前端er在杭州求职ing;详解 JavaScript 中的 Event Loop(事件循环)机制

  1. 前端特效05:绝对震撼的16行JS代码实现地球自转效果 今天,小编将与大家分享web前端特效荟萃系列第五期,喜欢把玩儿炫酷效果的小伙伴快快看过来^_^ ,希望大家喜欢呦~ 第五期,给大家分享一个使用 16行Javascript代码实现的地球自转效果,带给你屌炸天的动画效果,绝对震撼! 。相关代码如下: <!doctype html> <html lang="en"> <he…
  2. js深入学习绕不开的原型知识 最近在看underscore源码,涉及到js原型相关的知识,于是重温了一遍,在此做下记录。 js原型是其语法的一个难点,也是一个重点,要深入学习js必须掌握的点。要想读懂别人的框架和库,了解这些基础知识是必不可少的。 js原型主要为了提取公共属性和方法,实现对象属性和方法的继承。说到原型,可能就有几个相关的词: p…
  3. 了不起的 Gatsby.jsAmway Gatsby.js 是一个基于 React 的静态网站生成器 Blazing fast static site generator for React 前一阵看 React 官网文档的时偶然发现的 Kyle Mathews 小哥在 2015 年开了这个坑 到目前已有 17k+ 的 star,…
  4. 前端工程师的未来在哪里? 阿里妹导读:很多童鞋在上次的问卷调查里表示,希望多推出一些前端方向的内容。今天为大家分享一篇关于前端工程师职业发展的文章,抛砖引玉,期待与大家一起交流探讨。 我是成曰,目前在蚂蚁金服数据平台部任职前端工程师,从事数据中台产品的研发。目前对前端架构与质量、用户体验、TypeScript比较感兴趣。 …
  5. vue无缝滚动vue-seamless-scroll 一个简单的基于vue.js的无缝滚动 在线文档demo 小demo English Document 安装 NPM {代码…} 使用 ES6 详情的demo页面 example-src/App.vue {代码…} 普通的使用方法 (script标签引入)…
  6. 从 18000 篇中脱颖而出的 45 个最棒的 React.js 学习指南(2018 版) 原文 – Learn React.js from Top 45 Tutorials for the past year (v.2018) 原文作者 – Mybridge 原文地址 – https://medium.mybridge.co/learn-react-js-from-top-45-tutorials-for-the-past-year-v-2018-28b7f4d4b2c4 译者 – hijiangtao 译文地址 – https://hijiangtao.github.io/2018/01/23/learn-react-js-f…
  7. 16年毕业的前端er在杭州求职ing 因为曾经看过一篇文章 面试分享:一年经验初探阿里巴巴前端社招 所以来杭州也是带有目标的,网易!如果能有幸加入阿里,也是非常荣幸的。所以面试总是懒懒散散的,大概一天也就面试一家。 然后我的技术栈大概是react+node,GitHub地址: Nealyang 目前的状态是阿里通过了技术面和交叉面,大概下周一总监…
  8. 详解 JavaScript 中的 Event Loop(事件循环)机制 前言 我们都知道,javascript从诞生之日起就是一门单线程的非阻塞的脚本语言。这是由其最初的用途来决定的:与浏览器交互。 单线程意味着,javascript代码在执行的任何时候,都只有一个主线程来处理所有的任务。 而非阻塞则是当代码需要进行一项异步任务(无法立刻返回结果,需要花一定时间…
  9. domtoimage — html转化为图片 这段时间的工作中,一直在做canvas类的H5,开发的过程中很关键的一部分是将dom节点转化为图片。起初是用html2canvas来做的,做完之后感觉图片清晰度的效果不是很好,然后就再GitHub上找到 domtoimage这个js插件换了之前html2canvas。更换后不仅清晰度有所提高,能够支持的图片格式和dom节点样式也比html2canvas要多。 …
  10. [CSS]提出质疑:@import和link的区别 事情是这样的,自己在看这两个的区别的时候,看到的说法都是在说,@import会慢于link去执行,使用@import的时候样式表会在页面加载完之后再去执行,而link会在页面加载的时候执行,不过我在chrome下去测试却不是这样的,测试的结果是,按照其在页面中
  11. 基于vue-cli重构多页面脚手架 官方提供的项目生成工具vue-cli没有对多页面webApp的支持,但是在实际的项目中,我们需要这样的脚手架,参考了很多大牛的方法,这里提供了一种我的单页面脚手架转换为多页面脚手架的方案,供大家参考。不好的地方也请大家指正。 准备 使用vue-cli生成一个你需要的单页面项目脚手架,然后我们就要开始我们的改装工程…
  12. HTTPS 的故事 本文其实总体算是一篇译文,原作在此 HTTPS explained with carrier pigeons, 看完不禁感叹作者的思路清奇,于是跟风把原文重新“诠释”一下 … 你在 Internet 上的所有活动,其实都可以归类为 往服务器发送数据 以及 从服务器接受数据,也就是你与服务器的通信。原文作者对这个行为给了一个神奇的比喻:有一只…
  13. 2018 前端性能优化清单 – 第 2 部分 下面是前端性能问题的概述,你可以参考以确保流畅的阅读本文。 2018 前端性能优化清单 – 第 1 部分 2018 前端性能优化清单 – 第 2 部分 2018 前端性能优化清单 – 第 3 部分 2018 前端性能优化清单 – 第 4 部分 你会在你的项目中使用 AMP 和 Instant Articles 么? 依赖于你的组…
  14. 2017年 JavaScript 明星项目 概述 下面是不分类别的 2017 年度最受欢迎 Javascript 项目,如果你时间很紧,看这部分就够了。 Vue.js 蝉联冠军 Vue.js 再次强势登顶年度排行榜冠军,今年在 GitHub 上新增了超过 40K 的 star。相
  15. 快速掌握JavaScript面试基础知识(二) 译者按: 总结了大量JavaScript基本知识点,很有用! 原文: The Definitive JavaScript Handbook for your next developer interview 为了保
  16. 2018 前端性能优化清单 —— 第一部分 原文地址:Front-End Performance Checklist 2018 – Part 1 原文作者:Vitaly Friedman 译文出自:掘金翻译计划 本文永久链接:github.com/xitu/gold-m… 译者:tvChan 校对者:m
  17. 杜绝js中四种内存泄漏类型的发生 这篇文章将探索在客户端JavaScript中常见的内存泄漏代码,内存泄漏会造成一系列的后果:运行缓慢,应用崩溃,潜在危险,甚至会影响其他应用的运行。 介绍 内存泄漏是每一位开发者最终都会面临的一个问题。即使是在
  18. 开发一个webapck v3 的 loader Github地址 github.com/CodeLittleP… 前言 有时候,市面上的webpack loader并不完全符合我们的需求,所以,我们不得不自己从0开始写一个,或者是在别人写的loader基础之上进行修改。 无论哪种,都需要我们对webpack
  19. javascript中的Event Loop详解 首先来一段代码开篇 console.log(1); setTimeout(function() { console.log(2); }); function fn() { cons
  20. Javascript调试命令——你只会Console.log() ?Javascript调试命令——你只会Console.log() ? Console 对象提供对浏览器控制台的接入(如:Firefox 的 Web Console)。不同浏览器上它的工作方式是不一样的,但这里会介绍一些大都会提供的接口特性。Console对象可…
  21. RxJS: 理解 publish 和 share 操作符 原文链接: blog.angularindepth.com/rxjs-unders… 本文为 RxJS 中文社区 翻译文章,如需转载,请注明出处,谢谢合作! 如果你也想和我们一起,翻译更多优质的 RxJS 文章以奉献给大家,请点击【这里】 照片取自 Unsp
  22. 基于vue开发活动页-路由相关 距离第一篇的发布过了好久,因为这次真的踩了不少坑..以后还是尽量不要新立项目好了,就跟立了个flag一样T T 本篇主要内容有以下几点– 使用vue-router除了mode之外,可能还需要知道base属性 关于hash与history这两种模式的选择
  23. 基于css的优雅的用户跟踪技术 点击 这里 可以查看该仓库的一个 demo 证明仅用 CSS,是的,只用 CSS,不用 JavaScript 实现网页追踪 / 分析 我们可以用它来做什么 我们可以收集关于用户的一些基本信息,例如屏幕分辨率(当浏
  24. JavaScript 2018: 你需要和不需要深入的 – The New Stack 原文出处 JavaScript 2018: Things You Need To Know, and a Few You Can Skip – The New Stack JavaScript 现今已发展成熟 — 我们也不再是在页面上做一些小小的互
  25. webpack增量打包多页应用 一,webpack打包存在的问题 webpack的打包顺序: var path = require('path'); module.exports = { entry: { one: "./src/one.js", tw
  26. 2017年 JavaScript 框架回顾 — React生态系统 前一篇文章中,我们介绍了2017年 JavaScript 框架的整体情况。我们也了解到在众多的前端框架中,目前最为庞大又在快速增长的当属 React 了,本文就来重点介绍 React 的生态系统。
  27. Vue Devtools 4.0 有哪些新内容 原文地址:What’s new in Vue Devtools 4.0 原文作者:Guillaume CHAU 译文出自:掘金翻译计划 本文永久链接:github.com/xitu/gold-m… 译者:MechanicianW 校对者:okaychen Fa
  28. 深入理解React源码 – 首次渲染 V 上次我们看完了自定义组件渲染的表层逻辑。这个过程虽然看似很像简单组件对应的逻辑,但也包含一些其特有的处理:1)一个额外的ReactCompositeComponent 需要被实例化来代表这个自定义的组件(App);2)App.render()会触发很多个Rea
  29. Jsdom 11.6.0 发布,Web 标准的纯 JavaScript 实现 Jsdom 是许多 Web 标准的纯 JavaScript 实现,特别像是 WHATWG DOM 和 HTML 标准,主要用于 Node.js 。最新版本的 Jsdom 需要 Node.js v6 及以上版本。 Jsdom 11.6.0 部分更新内容: 新增功能齐全的 WebSocket 实现 新增 window.performance 实现 新增除 meterEl….
  30. 前端多项目模块化实践 已经连续加班快三个月了,最近抽个时间把一些心得记录下来,算是做个总结吧! 故事背景 公司的业务以做项目为主,主打的是电商行业,因此也决定了很多项目其实存在一定的共性。目前公司业绩不错(年底应该会有大把money吧),经常多个项目并行,这也暴露了整个团队存在的问

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条,每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等,为开发者提供动力,如果觉得内容对你有用,记得分享给你的小伙伴。进入码农头条查看更多


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流