20180209 前端开发日报

前端页面热更新实现方案；Gulp&Webpack搭建属于自己的特性化前端脚手架；Webpack 的基本架构和构建流程；你为啥还不用TypeScript？；从 Git 到区块链；[译]从1万篇文章中挑出的40篇最棒的 Vue 学习指南（2018版）；Vue 2.0学习笔记：组件数据传递；vue-router源码阅读学习

1. 前端页面热更新实现方案 前端页面热更新 了解过前端性能优化的同学应该清楚，给页面加载提速的终极方案就是CDN，这是BS架构本身的特点决定的，无论什么前端提速手段，最终都会回到客户端文件的传输上来；与之相对的CS架构则不存在加载压力，但CS架构的问题是更新不灵活，那么有没有一种方法能结合这两种架构的优点，在加载速度和更新灵活…
2. Gulp&Webpack搭建属于自己的特性化前端脚手架 之前看了很多教程,比如vue的脚手架,gulp的脚手架和大牛自己写的脚手架。发现没有什么是银弹能够满足公司业务的需要又能够开发的爽。所以结合公司业务的特性,自己动手用gulp和webpack写了一套适合我司的脚手架。 使用范围 专题等静态页面多 后台主导逻辑业务,前端主导交互等 需要整合es6,scss,eslint等 …
3. Webpack 的基本架构和构建流程 作者介绍：陈柏信，腾讯前端开发，目前主要负责手Q游戏中心业务开发，以及项目相关的技术升级、架构优化等工作。 前言 webpack 是一个强大的模块打包工具，之所以强大的一个原因在于它拥有灵活、丰富的插件机制。但是 webpack 的文档不太友好，就个人的学习经历来说，官方的文档并不详细，网上的学习资料又少有完整…
4. 你为啥还不用TypeScript？ 原文地址：https://medium.freecodecamp.org/why-would-you-not-use-typescript-67d0baa3eaca 在如今这个编程世界中，JS似乎已经成了最受欢迎的语言。加上Nodejs，我们有了后端编程的能
5. 从 Git 到区块链 本文由币乎(bihu.com)优质内容计划支持。 这是「区块链技术指北」的第 24 篇文章。 如果对我感兴趣，想和我交流，我的微信号：Wentasy，加我时简单介绍下自己，并注明来自「区块链技术指北」。同时我会把你拉入微信群「区块链技术指北」。BTW，李笑来老师也加入了我的知识星球，文末有加入方式。 …
6. [译]从1万篇文章中挑出的40篇最棒的 Vue 学习指南（2018版） 译者注：你们要的，有关 Vue 最棒的学习指南来了！作者研究了近1万篇 Vue 生态相关的文章得出这篇总结，全文既包含新手指南、年度回顾也包括框架对比、案例分析等专题，非常适合 Vue 开发者用于查漏补缺、收藏阅读。请大家注意该文中的大部分链接原文均为英文。文中如有错误，欢迎评论指出。 系列译文 从1.6万…
7. Vue 2.0学习笔记：组件数据传递 通过上一节中的学习，咱们了解了在Vue中怎么创建组件和使用组件。在项目中使用组件，目的一般就是提高代码复用率，增强模块化，从而降低开发成本。在文章结尾处，我们提到了Vue中组合组件，就是 A 组件中包含了 B 组件。而组件与组件之间的相互使用避免不了数据之间的传递。那么Vue中组件的数据是如何传递的呢？这就是这…
8. vue-router源码阅读学习 如同分析vuex源码我们首先通过一个简单例子进行了解vue-router是如何使用的，然后在分析在源码中是如何实现的 示例 下面示例来自于example/basica/app.js import Vue from ‘vue’ import VueRouter from ‘vue-router’ Vue.use(VueRouter) const Home = { template: ‘<div>home</div>’ } const Foo = …
9. React 16.3来了：带着全新的Context API文章概览 React在版本16.3-alpha里引入了新的Context API，社区一片期待之声。我们先通过简单的例子，看下新的Context API长啥样，然后再简单探讨下新的API的意义。 文中的完整代码示例可在笔者的GitHub上找到，…
10. 你不知道的Vuejs – 工欲善其事必先利其器 既然是实战，怎离不开项目开发的环境呢？先给大家推荐下我的个人开发环境： 硬件设备：Mac OSX 编译器：Visual Studio Code 命令行工具：iTerm2 调试工具：Chrome Dev tool + vue-devtools 版本管理：Git 具体工具的操作界面和如何使用，这里就不展示了。随便用搜索…
11. Golang HTTP 服务路由查询 通过黑科技扩展原生包的功能。 Golang HTTP 原始包 路由 黑科技获取变量内部变量 Golang HTTP 原始包 Golang 的框架用过不少，越来越发现还是原生的好。我们一般只做接口，对于项目服务没有那么高的灵活性要求，原生的 HTTP 包已经够用。而且原生包…
12. javascript 链表的实现 一边学习前端，一边通过博客的形式自己总结一些东西，当然也希望帮助一些和我一样开始学前端的小伙伴。 如果出现错误，请在评论中指出，我也好自己纠正自己的错误 author： thomaszhou 1-单项链表 链表定义： function LinkedList() { let Node = function(element) { // 辅助类，表示要添加到链…
13. 简单实用的css边框属性border本文主要讲述利用border属性做出不同的几何形状从而适用于比较好看的视觉样式。 预备知识 border相关属性 border-width 边框的宽度 border-style 边框的样式 border-color 边框的颜色 案例举例 为了更加通俗易懂…
14. （译）解密 ES6 语法下 React Class类的内存使用 原文链接：Demystifying Memory Usage using ES6 React Classes 作者： Donavon West 在 constructor 中使用 bind, 还是使用箭头函数作为类属性方法, 哪种做法更加高效？ 现在已经有
15. 你不知道的 Vuejs：组件式开发 by yugasun from https://yugasun.com/post/you-dont-know-vuejs-4.html 本文可全文转载，但需要保留原作者和出处。 初识组件 组件（Component）绝对是 Vue 最强大的功能之一。它可以扩展HTML元素，封装可复用代码。从较高层面讲，可以理解组件为自定义的HTML元素，Vue 的编译器为它添加了特殊强大…
16. React16 + next.js 4 + antd-mobile2 服务端渲染实践总结随着React服务端渲染越来越流行，笔者也想尝尝鲜，经过半个月的折腾，笔者把原先的客户端渲染项目，通过结合 next.js 构建了一个服务端渲染的同构项目。再加上开启服务器页面缓存，以及静态资源CDN加速优化，最终…
17. 浏览器缓存、CacheStorage、Web Worker 与 Service Worker 前言 最近在翻红宝书，看到 Web Worker 那章，猛然意识到，通过它竟然可以把几个缓存相关的概念串起来，甚是有趣，撰文记之。最后我也写了一个完整的离线应用 Demo，以供运行调试。 浏览器缓存 传统意义上的浏览器缓存，分为强缓存和协商缓存，其共同点都是通
18. react-loadable原理浅析 react-loadable 最近在学习react，之前做的一个项目首屏加载速度很慢，便搜集了一些优化方法，react-loadable这个库是我在研究路由组件按需加载的过程中发现的，其实react-router v4官方也有code splitting的相关
19. 三端易用的现代跨平台 JavaScript bridge -IOS篇 DSBridge v3.0 是一个里程碑版本，和v2.0相比，有许多变化，需要注意的是v3.0 不兼容 之前版本，但是我们也会继续维护v2.0分支，所以，如果你是v2.0的使用者，请放心继续使用v2.0，如果你是新用户，请使用>=v3.0. DSBridge v3.0.0 更新列表 DSBridge-Android 特性 Android、IOS、J…
20. 用代码来画图——CSS绘制简单的卡通形象 大家都喜欢各式各样的卡通形象，比如Hello Kitty、加菲猫等等，但并不是所有人都能有创作这些卡通形象的过人画工。对于我们很多人而言，常年与电脑相伴的生活早就使我们忘记了如何持握画笔，如何去勾勒线条。但是你知道吗？完全不用画笔，也不需要多少绘画经验，仅仅需
21. JSP自定义标签就是如此简单为什么要用到简单标签？ 上一篇博客中我已经讲解了传统标签，想要开发自定义标签，大多数情况下都要重写doStartTag(),doAfterBody()和doEndTag()方法，并且还要知道SKIP_BODY,EVAL_BODY等等的变量代表着什么，在…
22. 后端工程师入门前端页面重构（二）：心法 I 上一篇博客是我们《后端工程师入门前端页面重构》系列的第一篇，我们介绍了页面布局的口诀： 从左到右，从上到下，化整为零。 那么在接下来的几篇文章中，我们就来聊聊页面布局的「心法」和一些具体的「招式」。 那么什么是心法呢？ 如果说口诀是页面布局的原则，那么心法就是对页…
23. ES6时代，你真的会克隆对象吗（二） 原文：ES6时代，你真的会克隆对象吗(二) 上一篇，我们从Symbol和是否可枚举以及属性描述符的角度分析了ES6下怎么浅拷贝一个对象，发表在掘金和segmentfault上，从评论看，部分人觉着看不懂，今天，我们用更简单的方式来聊聊深拷贝的问题 写在前面 深
24. Vue实战篇（Vue仿今日头条） 前言 vue也弄了一段时间了, 前段时间一直想用vue写个移动端,加之年底也不是很忙,于是前几天便着手开始弄了,到今天为止也算是勉强能看了 因为也是纯粹的写写前端页面,所以数据方面用的是mock.js,为了真实的模拟请求,可以直接在 Easy Mock 自己生
25. webpack 4.0.0-beta.0 新特性介绍 近年来前端技术如雨后春笋般蓬勃发展，我们也在这个潮流下不断地学习、成长。前端技术的不断发展，给我们提供了许多的便利。例如：JSX的出现为我们提供了一个清晰、直观的方式来描述组件树，LESS/SASS的出现提高了我们书写css的能力，AMD/CommonJS/E
26. 用 Javascript 实现一个简易 BrainF**k 解释器 用 Javascript 实现一个简易 BrainF**k 解释器写于 2014 年 10 月 08 日 11 时 42 分更新于 2017 年 12 月 11 日 15 时 59 分 首先祝贺自己在 CodeWars 升级到 3 Kyu
27. 使用 Typescript 检查你的代码规范背景 越来越多的前端项目开始使用typescript这门静态检查语言了，它包括很多很棒的功能点，在这里就不细述，根据静态语法检查和.d.ts生成的代码提示两大特性，我们就可以来制定并且检查代码规范，现在我们来详细…
28. 结合 CSS3 transition transform 实现简单的跑马灯效果这是之前客户的一个需求，给的 demo 是用 gif 实现跑马灯，但是我们的没法用 gif，因为图上的文字需要翻译成各国语言，所以不能使用图片来实现，那么，自己写一个咯。 思考过程html {代码…} css {代码…} js {…
29. 前端系列——nodejs环境下http2初尝试目的 http2出来也有段时间了，很多网站都已经实际应用了它，而我还活在http1.1的时代，趁着还年轻，记性还行，花点时间研究了http2在nodejs中的使用。 http2基础理论 HTTP2是二进制协议 这是一个复用协议。并行的…
30. react-native-whc-banner 支持ios 、android可高度自定义 A react native module to banner auto play loop component, it works on iOS and Android.

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

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