20180828 前端开发日报-前端开发博客

前端每日实战：118# 视频演示如何用纯 CSS 创作一个沙漏 loader；JS设计模式——发布订阅模式；前端项目框架搭建随笔—input组件的编写；Go 1.11 和 WebAssembly；vue生命周期（五）；鸽子传信解释 HTTPS；由一篇ES6继承文章引发对于super关键字的思考；Vue中的异步组件

前端每日实战：118# 视频演示如何用纯 CSS 创作一个沙漏 loader效果预览按下右侧的“点击预览”按钮可以在当前页面预览，点击链接可以全屏预览。 [链接] 可交互视频此视频是可以交互的，你可以随时暂停视频，编辑视频中的代码。请用 chrome, safari, edge 打开观看。 [链接] …
JS设计模式——发布订阅模式这里其中关键的一点就是利用对象键值对存储了事件，在某个事件调用存储的事件，移除事件也是通过对对象重新赋值。这里使用对象作为存储的数据格式是因为通过键查询的复杂度是1，可以快速搜索到某个键存储的函数列…
前端项目框架搭建随笔—input组件的编写接上篇文章，费心劳神好几天的项目框架终于可以用了。现在可以开始写页面了吧？既然上司说，UI框架我们自己来写，那我们就自己写吧。虽然答应的时候挺痛快。真到写的时候，首先就不知道从哪里开始下手了那我们就一点点来。先从组件框架开始一点点做。首先先排布一下UI框架目录
Go 1.11 和 WebAssembly Go1.11已经正式发布，最大的一个亮点是增加了对WebAssembly的实验性支持。这也再一次验证了Ending定律的预言：所有可以编译到WebAssembly平台的软件终将会被编译到WebAssembly平台。在上一周，qemu的作者bellard大神将Windows 2000搬到浏览器到新闻彻底引爆了WebAssembly技术，这也证明了WebAssembly的强大的…
vue生命周期（五）每个Vue实例在被创建之前都要经过一系列的初始化过程,这个过程就是vue的生命周期一、生命周期钩子函数 beforeCreate created beforeMount mounted beforeUpdate updated beforeDestroy destroyed var vm = new Vue({ el: ‘#app’, data: { message: ‘Vue的生命周期’ }, bef…
鸽子传信解释 HTTPS 原文地址：HTTPS explained with carrier pigeons不妥之处，欢迎指正！密码学是个很难理解的课程。它包含很多的数学证明。但是其中很多复杂性都不需要深入的去理解，除非你要去开发加密系统。如果你希望通过阅
由一篇ES6继承文章引发对于super关键字的思考子类中存在constructor方法的时候，需要调用super方法，并且需要在使用this关键字之前调用
Vue中的异步组件特别声明，本文根据@Alex Jover Morales的《 Async Vue.js Components 》一文所整理。随着应用程序越来越大，你开始考虑优化应用程序，使其变得更快。在此过程中，你可能使用了拆分代码和延迟加载这两种方法，它们通过将代码块的加截推迟到需要的时候加载，从而使应用程序的初始包变得更小。延迟加载对于应用程序…
Webpack+Electron+React小记看惯了网上各种全家桶，各种X+Y+Z，今天我也来凑凑热闹，和大家一起聊一聊如何使用Webpack打包基于Electron+React开发的跨平台桌面应用。 Electron是一个结合Node.js和Chromium实现的跨平台桌面应用解决方案，提供了操作系统访问Api，并赋予普通HTML网页访问Node.js本地模块的能力。使得掌握传统HTML、CSS和JS等技术的…
深入理解css之float在css中，是存在流的概念的。在正常情况下，页面总是从左到右，从上到下布局，这种被称为正常的流。但是有很多情况，正常流是没办法实现的，因此我们需要一些手段来破坏流，从而实现一些特殊的布局，而本节的主角…
前端原发性 DDoS 来源内容来源于公司内部技术分享<前端原发性DDos防御与应对方案> DDos 要知道DDos是什么？首先得了解Dos，拒绝服务攻击（denial-of-service attack）亦称洪水攻击，是一种网络攻击手法，其目的在于使目标计算机的网络或系统资源耗尽，使服务暂时中断或停止，导致其正常用户无法访…
JavaScript七种非常经典的创建对象方式JavaScript创建对象的方式有很多，通过Object构造函数或对象字面量的方式也可以创建单个对象，显然这两种方式会产生大量的重复代码，并不适合量产。接下来介绍七种非常经典的创建对象的方式，他们也各有优缺点。…
git命令总结1、git status （查看当前代码状态，还有个git stash） 2、git pull （拉取远程代码，使本地代码保持最新，git pull –rebase）3、git branch -a （查看当前所在分支，以及该工程下的所有分支，如果标有remotes/o…
vue中的数据绑定（二） Vue 对象的改变会直接影响到 HTML 的标签的变化，而且标签的变化也会反过来影响 Vue 对象的属性的变化一、数据渲染 <div>{message} </div><!–数据绑定–> <div v-html="htmlMess"></div> <!–html绑定–> <div v-text="message"&gt…
深入理解 TypeScript 此书是 TypeScript Deep Dive 的中文翻译版，感谢作者 Basarat 的付出。 Why 数据来源：npm 包下载量正如你所见，TypeScript 发展至今，已经成为大型项目的标配，其提供的静态类型系统，大大增强了代码的可读性以及
现代JS中的流控制：: Callbacks to Promises to Async/Await JavaScript经常声称是asynchronous。那是什么意思？它如何影响发展？近年来这种方法有何变化？请思考以下代码： result1 = doSomething1(); result2 = doSomething2(result1)
初识vue与环境搭建（一） Vue 框架是一个 MVVM 框架， Module 和 view 是双向绑定的。 vue 没有控制器的概念，它的核心思想是数据驱动，状态管理，以及组件化。因此在我们js编程中，不会去操作 DOM 、 class ，更多的关注我们的数据层面。去改变一个变量，通过变量来控制我们的视图，通过事件绑定、状态…
JavaScript编程语言简介介绍 JavaScript是世界上最流行的编程语言之一。自20年前创建以来，它已经走了很长一段路。作为第一个也是唯一一个由Web浏览器本机支持的脚本语言。在一开始，它并没有像现在这样强大，它主要用于花哨的动画和当时称为DH
【你和GitHub高手就差这三条规则······】本文介绍了每天使用 Git 和 GitHub 的重要性，还分享了三个帮助大家成为 Git 和 GitHub 高手的简单规则。详见（来自：机器之心）
我厌倦了 Redux，那就造个轮子 Rectx：第三集呵呵，你没想到吧，这玩意儿竟然有第三集！我靠，我自己都没想到，让我们悄悄的回顾一下前两集完全没想到，竟然会有第二集！
JavaScript[21] — 数学函数数学函数 Math.random() 随机生成0到1的小数,包括0,不包括1 {代码…} Math.ceil() 返回大于参数值的最小整数(天花板值),遇到小数向上取整 {代码…} Math.floor() 返回小于参数值的最大整数(地板值),遇到小数向…
vue 基本指令（四） v-text 更新元素的 textContent <h1 v-text="msg"></h1> v-html 更新元素的 innerHTML <h1 v-html="msg"></h1> v-bind 当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM <!– 完整语法 –> …
Golang http.RoundTripper 笔记RoundTripper is an interface representing the ability to execute a single HTTP transaction, obtaining the Response for a given Request.
JavaScript中创建原子的几种方法本文是“JavaScript的元语言”系列中的一篇。其它内容参见： *JavaScript的元系统 JavaScript中可以通过 Object.create(null) 来创建原子，这是非常自然而又易于理解的方式。不过也有一些其它的方法来实现相同的效果，虽然在概念上有所不同，但是它们创建的一样是“原子对象”。创建原子使用O…
JavaScript系列事件事件是文档或者浏览器窗口中发生的一些交互瞬间。JS注册事件处理程序来预订事件，当事件发生的瞬间来执行相应的代码，进而实现 JS 和 HTML(即文档或者浏览器窗口) 的交互。
VUE单页应用首屏加载速度优化方案单页应用会随着项目越大，导致首屏加载速度很慢！！！以下给出在下知道的几种优化方案使用CDN资源,减小服务器带宽压力路由懒加载将一些静态js css放到其他地方（如OSS），减小服务器压力按需加载三方资源，如…
【GitOps——一种实现云原生的持续交付模型】你可能已经听说过“GitOps”，但并不知道它到底是什么，除了 GitOps，你可能还听说过 DevOps，或者 AIOps、GOps 等，是的，现在是“Ops”盛行的时代。
《Redux进阶（一）》在用Redux处理深度复杂的数据时会有一些麻烦。由于js的特性，我们知道当对一个对象进行复制时实际上是复制它的引用，除非你对这个对象进行深度复制。（by 卖烧烤夫斯基）
命令行工具 —— 手写类似 http-server 的静态服务器原文出自 https://www.pandashen.com 前言 npm 里有个 http-server 的模块，是一个简单的、零配置的 HTTP 服务，它非常强大，同时非常简单，可以方便的帮助我们开启本地服务器，以及局域网共享，可以用来做测试，开发，学习
vue事件（六） <div id="test"> <button @click="sayHi(‘你好’)">说你好</button> <!–这里使用@–> <button @click="sayHi(‘我被点击了’)">说我被点击了</button> <!–这里使用@–> </div> <script type="text/javascript"> …