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前端日报 订阅精彩文章

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

原创文章:20180209 前端开发日报 ,未经许可,禁止转载,©版权所有
原文出处:前端开发博客 (http://caibaojian.com/fe-daily-20180209.html)