体验微前端（qiankun）；总结一下使用JavaScript和Vue一些简化代码的功能；跟着大佬学习vue的diff算法；看到赚到重读vue2.0风格指南，我整理了这些关键规则；JavaScript的小秘密；浅析 Vue 的双向绑定；Vue 3 响应式原理及实现；五.记一次用webpack搭建vue项目
-
微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略，下面这张图来了解下。 qiankun qiankun 蚂蚁金服基于single-spa 的微前端解决方案，生产可用。 特性 基于 single-spa 封装，提供了更加开箱即用的 API。 技术栈无关，任意技术栈的应用均可 使用/接…
-
一、前言 现在也算上暂时闲下来了。算算已经好久没写文章了。这篇文章记录下我使用的一些前端小功能吧。如有错误，请及时指出。 二、vue数字滚动小组件 开发中要用到数字上下滚动的组件。在 github 上找了找这种功能。找到了一个 vue-digitroll 。周末花了一下午的时间研究了 vue-digitroll 的源码…
-
本文旨在理一下vue中diff算法的主要逻辑和关键细节。 从一个简单的demo切入： p标签渲染一个items数组 <div id="demo"> <p v-for="item in items" :key="item">{{ item }}</p> </div> <script src="../vue-source/dist/vue.js"></scr…
-
又是一个阳光明媚，风和日丽的周末，有人陪女神去逛街，有人陪女神去看电影，小编却默默的拿出电脑。哈哈哈，不是小编屌丝，女神正坐在旁边玩手机（感觉不是屌丝才怪）。 这两天小编重读了一遍vue2.0官网的风格指南，整理了这九条关键规则。 v-for设置键值 提到 v-for 需要设置键值，许多人第一反应会从 diff 算…
-
JavaScript 中所哟变量都可以当作对象使用，除了两个例外 null 和 undefined。 false.toString(); // false .toString(); // "1,2,3" funciton Fun(){} Fun.num = 1; Fun.num; // 1 复制代码 一个常见的误解是数字的字面值不能当作对象使用。这是因为JavaScript解析器的一个错误，他试图将点操作…
-
Vue 中的双向绑定是指当我们改变 data 中的一个变量时，页面中该变量也会随之跟新，我们在页面中改变一个变量时，data 中变量的值也随之变化。 通常我们使用 v-model 来实现双向绑定，并且 v-model 只能在 input、selsect、textarea 元素和 component 中使用。 1. v-model 的原理 <input type="text"…
-
从零开始实现你自己的响应式库，从零开始实现 Vue 3 响应式模块。本文完整内容见buid-your-own-vue-next 1. 实现响应式 响应基本类型变量 首先看一下响应式预期应该是什么样的，新建一个 demo.js 文件，内容如下…
-
前言：都2020年了，感觉是时候该学一波webpack了，趁着最近有时间，就学了一下，等把官网上的webpack结构和模块大概看了一遍之后，就感觉可以开始搭个项目实战一下了，从0开始，一步步记录下来 使用版本： webpack4.x 1.包含插件和loader * html: html-webpack-plugin clean-webpack-plugin * css: …
-
在疫情期间，上班族开启了远程办公，体验了各种远程办公软件。老师做起了主播，学生们感受到了被钉钉支配的恐惧，歌手们开启了在线演唱会，许多综艺节目也变成了在线直播。在这全民互动直播的时期，我们来聊聊互…
-
众所周知， Vue.js 组件是Vue创建自定义元素的重要功能之一，同时，模板可帮助你避免从头开始创建网页设计。总之，这些工具对于希望其开发过程更快，更高效的任何Web开发人员都是必不可少的。 此外，在过去的几年中，Vue.js 变得非常流行，许多企业将其添加到他们的技术栈中。该框架的优点是它具有内置的数据绑定和M…
-
最近做了一个小型的vue的h5项目，发现在手机上运行的时候，第一次进去的首页比较慢，然后同事提了下可以在生产环境用cdn，于是我尝试了下 生产环境开启cdn 1、 在 vue.congfig.js 里面加入 const isProduction = process.env.NODE_ENV == "production"; configureWebpack: (config) => { if (…
-
最近接到一个需求，实现一个用户昵称的输入框，需要限制当前字数与最大字数，超过最大字数输入无效。 效果： 由于 JavaScript 用的是 UCS-2 编码方式（UTF-16 的子集），造成所有字符在这门语言中都是2个字节，如果是4个字节的字符，会当作两个双字节的字符处理。这就造成字符编码从65536开始的4个字节的…
-
作为前端经常遇到线上报错却无法复现的情况，要是这个时候有错误监控能快速帮我们定位问题所在，再查找错误监控的相关资料尝试去实现一个自己的sdk。下面我以 错误监控 和 设备信息 两方面作为关注点去实现。 完整代码 错误监控 运行时报错 window.onerror = (msg,url,lineNo,columnNo,e) => { // …上…
-
vue3 beta 版本已经发布快两个月了，相信大家或多或少都有去了解一些 vue3 的新特性，也有一部分人调侃学不动了，在我看来，技术肯定是不断更迭的，新的技术出现能够提高生产力，落后的技术肯定是要被淘汰的，五年前会JQ一把梭就能找到一份还行的工作，现在只会JQ应该很少公司会要了吧。刚好前两天尤大也发了一篇文章讲…
-
从零开始在NodeJs中使用node-schedule增加定时器任务
java中直接使用定时器类就行了，但是在node中就没有这么简单了，只能使用setInterval或者setTimeout两个方法来实现，但是太繁琐了，搜索了之后发现 node-schedule 这个包，特意试用一下 版本 node版本12.16.2 koa2版> 2.7.0 1. 安装 npm insatll node-schedule -S 复制代码 2. 使用方法 2-1. 调用格式 // 任…
-
Webpack(系列三)：热模块更新和使用 Babel处理 ES6语法
比如，我做了css样式的修改，当我想要在不刷新当前页面html的前提下，让样式渲染出来，就需要用到热模块更新了，相关配置: 在webpack.config.js文件中，对devServer和plugins进行配置 const webpack = require(‘webpack’) // 移入webpack 在plugins中需要用到它的热模块加载方法 module.exports = { dev…
-
点赞再看，养成习惯本文 GitHub [链接] 上已经收录，更多往期高赞文章的分类，也整理了很多我的文档，和教程资料。欢迎Star和完善，大家面试可以参照考点复习，希望我们一起有点东西。
-
最近在写一个类似截图里的简易画图的小工具，画线，画矩形，画圆，可以选择颜色，就像这样 写的过程中遇到了一些坑，还好爬出来了，也得到几位大佬的指点，稍微接触了一下zrender，在这里记录一下。 坑1，绘制过程的预览 用canvas画线没什么问题，moveTo和lineTo就好了，来一段代码凑字数（:joy:） 鼠…
-
Git 作为一种分布式版本控制系统已经成为现在开发的宠儿，不仅应用在前端、后端、客户端等开发场景中，也成为各行业互联网企业分工协作的必备技能之一。
-
Manually capture an exception and send it over to Mustang ####入参 名称 | 类型 | 描述 | 备注 — | — ex | error | An exception to be logged | 必填 options | object | A specific set of options for this error | 可选 出参 名称 | 类型 | 描述 — | — Mustang | object | Mustang 对象自身 使用…
-
使用 JavaScript 实现一个高效的 LRU cache
如何利用 JavaScript 类型化数组的强大功能，为固定容量的数据结构设计自己的低成本指针系统 假设我们需要处理一个非常大（比如几百 GB）的 csv 文件，其中包含需要下载的 url。 为了确保我们在解析整个文件的时候不会耗尽内存，我们逐行的读取这个文件： csv.forEachLine(line => { download(line.url); })…
更多内容请关注公众号【前端开发博客】每日更新
