如何优雅的使用Web Worker；优雅绝妙的Javascript跨域问题解决方案；Vue2.0源码阅读笔记（十一）：自定义事件；前端ssr技术探究；js跳出forEach循环的骚姿势；Vue 相关原理学习笔记；vue的开发总结；CSS实现一个粒子动效的按钮
-
如何优雅的使用Web Worker 欢迎star： complex-calculations-worker Web Worker是HTML5中提出的概念，用来处理独立于主线程处理高费时的任务，从而不会阻塞主线程。目前绝大部分浏览器都支持Web Worker功能，不过使用时要注意它不能操纵DOM元素、同源政策等问题。 Web Worker的使用一般是指定一个脚本的URI来执行worker线程，通过 postMe…
-
优雅绝妙的Javascript跨域问题解决方案 关于Javascript跨域问题的解决方案已在之前的一片文章中详细说明，详见： http://blog.csdn.net/sfdev/archive/2009/02/13/3887006.aspx ； 除了文中提到的3种解决方案之外，在今年的baidu salon分享会上黄方荣主讲的《WEB数据交互的艺术》中提到一个非常优雅绝妙的解决方案！话不多说，直接上解决方案原理图： 该…
-
Vue2.0源码阅读笔记（十一）：自定义事件 Vue 事件分为两类：原生DOM事件、自定义事件。其中原生DOM事件既可以在元素上使用，也可以在组件上使用，在组件上使用时要添加.native修饰符。 Vue 通过调用原生API来处理元素和组件上绑定的原生DOM事件，在组件上的自定义事件则是由基于 发布/订阅模式 的事件中心机制完成的。 一、手动实现事件中心 …
-
前端ssr技术探究 :rocket:前言 随着react、angular以及vue的兴起，spa技术使得前端开发效率显著提升，同时也带来了一些问题，如不利于seo,首屏加载缓慢，造成白屏问题。那么为什么会造成这些问题，什么是spa技术，什么ssr技术呢？ spa(single page application) 简述： single page application单页面应用，只有一张Web页面的…
-
js跳出forEach循环的骚姿势 今天修改一个BUG。当forEach循环中满足某个条件时候就不在循环了。内心第一反应 添加return false 搞定~ 但是代码他依旧继续循环。。 我的表情是： 只能说自己是真菜。。需要努力把基础学扎实。。 然后就去度娘一下。。答案是 如果想跳出forEach 只能通过 throw err 才可以~ 当然这个是使程序中断-算跳出 严…
-
Vue 相关原理学习笔记 响应式原理 方案一：Object.defineProperty 基于 Object.defineProperty 通过 setter/getter 方法来监听数据的变化。 getter 进行依赖收集，setter 在数据变更的时候通知订阅者，递归调用监听对象的所有属性。 缺点： 无法检测到对象属性的添加或删除 不能监听数组的变化，需要重写数组方法 functio…
-
vue的开发总结 https://github.com/bailicangdu/vue2-elm 一、router.go ;router.push和 router.replace的区别 1. router.go(n) 这个方法的参数是一个整数，意思是在history记录中向前或者后退多少步，类似window.history.go(n) 2. router.push(location) 想要导航到不同的URL，则使用router.push方法，这个方法会向history…
-
CSS实现一个粒子动效的按钮按钮（button）可能是网页中最常见的组件之一了，大部分都平淡无奇，如果你碰到的是一个这样的按钮，会不会忍不住多点几次呢？
-
js中进行数字,超大金额(千位符)格式化处理 最近遇到一个需求,对于社区里讨论的帖子展示一个访问量的计数显示问题,当超过多少页面访问量时,就让其显示xxx万,xx亿 对于后台返回该字段的数据类型是number,需要进行格式化数字的输出 这个应用场景在前端开发中其实很普遍,例如:音乐app里面音乐歌曲播放数量,微博里的点赞数,评论留言条数,页面的访问量,超大金额(千…
-
vue-cli3携手rollup、github-actions打造自动部署的vue组件模板（使用篇）前言 旨在让开发者在开发时拥有 享受组件开发 一个长得还不错的demo rollup类库打包工具对代码的抚摸 eslint代码风格检查、自动格式化带来的快感 github-actions把demo自动部署到gh-pages身上 的一条龙服务。(接…
-
JS模拟数组操作（新增、删除、插入、排序、反转） 由于 js 没有 C 语言的指针，所以我们这里模拟数组只是模拟数组操作的思路。 由于本人水平有限，欢迎大家指正，看过能点个赞就更好了，谢谢大家。 先创建一个 ArrayList 类。 class ArrayList { list: any ) { this.list = list this.length = list.lengt…
-
以列表页为例，谈 React Hooks 的逻辑抽象与封装 本文不是hooks的最佳实践指南，也不是类似hox的state manager，而仅仅是探讨，当我们使用react hooks开发业务时，如何对组件逻辑进行抽象与封装。 react官方在推出Hooks之初，就提到“hooks解决了之前开发中遇到的非常多的问题” Hooks solve a wide variety of seemingly unconnected problems in React tha…
-
客户端发送多条 HTTP 请求用多线程会比单线程快吗？ 本文想从一个角度来让大家认识到回答一个问题不能从表面或者感觉来判断，这是学习技术的大忌，很多新手如果刚开始没有一套学习方法，从各种碎片化信息去学习编程，学习一段时间很容易进入瓶颈期，所以我觉得有必要通过一些我平时思考过的问题，踩过得坑，来总结一下也方便自己日后巩固，另一方面也想分享出来帮助需要的…
-
SpringBoot 消息推送之 WebSocket和SseEmitter 用途 实时获取服务端的最新数据 查看调度任务的进度和执行状态 用户感知：修改数据后，相关用户收到信息 提升用户体验：耗时业务异步处理（Excel导入导出，复杂计算） 前端轮询 这种方式实现简单，前端通过 setInterval 定时去请求接口来获取最新的数据，当实时性要…
-
JavaScript 类完整指南在 JavaScript 中不存在 Java 或 Swift 等语言中所使用的作为创建对象 蓝图的传统类，原型继承仅处理对象。
-
mobx在react如何使用？3分钟学会 这边文章主要目的呢。是搭建一个react和mobx的demo。能够了解mobx在react应用中如何使用的。我会用大白话的形式写这个文章； 文末有react 和react-native 的两个集成mobx的项目demo。react-native的实现思路和下面一样。 #####1.create-react-app创建react项目 脚手架命令生成一个项目: 1.create-react-app react_mo…
-
Vue项目打包部署总结使用Vue做前后端分离项目时，通常前端是单独部署，用户访问的也是前端项目地址，因此前端开发人员很有必要熟悉一下项目部署的流程与各类问题的解决办法了。Vue项目打包部署本身不复杂，不过一些前端同学可能对服…
-
【vue-进阶】什么？公司竟不让我提交代码(记一次 Vue2.0 项目配置 ESLint) 协同开发过程中，不同的编码习惯写出的代码，差异很大。日常维护代码或者修复bug的时候时候，看各种风格的代码，影响效率不说，还有可能改出低级问题。目前我们的项目还没有代码规范，我决定要做点改变，于是考虑使用 ESlint 来做代码规范检查。 考察了 ESlint的官方网站 和一些技术贴，决定先给我们其中的一个 Vu…
-
原生javascript实现类redux状态管理器 react、vue 将一个应用划分成不同的组件，一个组件的状态可能会影响另一个组件，随着项目日渐复杂，组件间通信就是一个令人头疼的问题… 我：qio tto ma tte！项目日渐复杂导致状态管理困难？ 引起一个 model 变化的因素可能会有很多种：服务器响应、缓存数据、本地数据、ui 状态、用户事件…我们怎么来处理…
-
11 个 JavaScript 精简技巧点赞再看，养成习惯本文 GitHub [链接] 上已经收录，更多往期高赞文章的分类，也整理了很多我的文档，和教程资料。欢迎Star和完善，大家面试可以参照考点复习，希望我们一起有点东西。
-
[技术翻译]Web网页内容是如何影响电池使用寿命的？ 本周再来翻译一些技术文章，本次预计翻译三篇文章如下： 使用Nuxt生成静态网站]()( Generate Static Websites with Nuxt ) Web网页内容是如何影响电池功耗的]()( How Web Content Can Affect Power Usage ) 在现代JavaScript中编写异步任务]()( https://web.dev/off-main-…
-
深入浅出Node.js学习笔记（五） 基于无阻塞、事件驱动建立的Node服务，具有内存消耗低的优点，非常适合处理海量的网络请求。 1. V8的垃圾回收机制与内存限制 对于性能敏感的服务器程序，内存管理的好坏、垃圾回收状况是否优良，都会对服务构成影响。而在Node中，这一切都与Node的JavaScript执行引擎V8息息相关。 1.1 Node与V8 Node是一个构建在Chro…
-
深入浅出Node.js学习笔记（四） Node是首个将异步大规模带到应用层面的平台，它从内在运行机制到API的设计，无不透露出异步的气息来。 1.函数式编程 在JavaScript中，函数作为一等公民，使用上非常自由，无论调用它，或者作为参数，或者作为返回值均可。 函数式编程是JavaScript异步编程的基础。 1.1高阶函数 高阶函数把函数作为参数，或是将函数…
-
一看就会的vuex实现登录验证（附案例）Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。
-
前端面试基础回顾之深入JS继承 前言 对于灵活的js而言，继承相比于java等语言，继承实现方式可谓百花齐放。方式的多样就意味着知识点繁多，当然也是面试时绕不开的点。撇开ES6 class不谈，传统的继承方式你知道几种？每种实现原理是什么，优劣点能谈谈吗。这里就结合具体例子，按照渐进式的思路来看看继承的发展。 准备 谈到js继承之前先回顾下js …
-
重新认识一下JS声明变量的六种方式吧 先说一下JS中有哪六种变量的声明方法吧，然后我们带着三个问号去看文章：what？how? where？ 六种声明变量的方法： var let const function import class 没有对比就没有伤害(var、let、const) 面试中，有不少的面试官喜欢问let、var、const的区别，虽然这个问题很简单，但是从这道题中，…
-
【漫游Github】无编译/无服务器，实现浏览器的 CommonJS 模块化平时经常会逛 Github，除了一些 star 极高的大项目外，还会在 Github 上发现很多有意思的小项目。项目或是想法很有趣，或是有不错的技术点，读起来都让人有所收获。所以准备汇总成一个「漫游Github」系列，不定期…
-
2019年京东PLUS会员前端开发之路 时光如梭，白驹过隙，2019年转瞬即逝。这一年对于 PLUS 会员项目前端同学来说是坎坷和充实的，如白岩松所说，痛并快乐着。回首望去，异业合作权益的陆续接入，6.18大促和双11活动的需求扎堆，中间穿插部分机型首屏白页等问题的困扰，在一阵慌乱之后，我们逐渐稳住了阵脚。在完成日常需求的同时，基于原有框架，对项目的…
-
从 V8 源码理解 JavaScript 函数是一等公民 摘要 本文从 V8 源码的角度分析为什么 Javascript 语言中的函数是一等公民。首先会介绍一等公民的概念，然后对比一下 C 语言函数和 Javascript 函数的底层表示，以便理解为什么说 Javascript 函数是一等公民。 什么是编程语言中的一等公民 In computer science, a programming language is said to ha…
-
Vue.js 内部原理浅析 原文： medium.com/js-imaginea… 说到 JavaScript 框架，Vue.js 绝对是个热门的 UI 框架（译注：截至本文翻译时其 Github 155k :star:️ & 23k :fork_and_knife:, 关注数已经超过了 React）。于我来说 Vue.js 最吸引人的地方在于 — 其学习曲线，非常之低。个人角度来讲，我感觉就像正在做着 jQuery 一…
-
Single-Spa微前端实践 在前端，往往由一个前端团队创建并维护一个 Web 应用程序，使用 REST API 从后端服务获取数据。这种方式如果做得好的话，它能够提供优秀的用户体验。但主要的缺点是单页面应用（SPA）不能很好地扩展和部署。中后台应用由于其应用生命周期长 (动辄 3+ 年) ，由于参与的人员、团队的增多、变迁，等特点从一个普通应用演变…
前端日报栏目数据来自码农头条，每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等，为开发者提供动力，如果觉得内容对你有用，记得分享给你的小伙伴。进入码农头条查看更多
