10-讲讲vue-element-admin开源项目;Vue3 源码逐行解析;自己动手写一个js动画库;图片懒加载原理实现及vue的快速引入使用;探索JS原型链的起源;使用Vue开发浏览器插件;云开发JavaScript实战 | 如何使用 tcb-js-sdk 实现图片上传功能;【架构师必备】基于node.js的脚手架工具开发
-
在根目录下创建 vue.config.js ,做一些相应的配置 //为什么是module.exports,因为此文件的执行环境是node环境 module.exports={ publicPath:’/best-practice’,//部署应用包时的基本URL devServer:{ port:port }, configureWebpack:{ // 想index.html注入标题 name:’vue最佳实践’ …
-
Vue3 源码解析 vue3 出来有一段时间了。今天正式开始记录一下 vue 3.0.0-beta 源码学习心得。 本文编写于 2020-06-10,脚手架使用 vite-app 版本 0.20.0,内置 vue 3.0.0-beta.14。 ps: 可能大部分人都不清楚 vue…
-
css animation应该是我们非常熟悉的css特性之一了,也诞生了例如 animate.css 在内的许多方便我们使用css动画的工具。而通过JS来创建动画的Web Animations API也早早进入了Working Draft阶段,不过目前的兼容性还比较一般。 而在此之前,例如jQuery的animate方法和TweenMax.js等则是前端开发者常用的动画工具。 虽然…
-
使用懒加载原因 网站中使用图片是必不可少的,尤其是电商网站,举个栗子,一个商品列表最少60个商品,每个200K,实际上用户可能看了前面10来张,后面的就不看了,现在来计算一下,50*0.2M=10M,页面图片多,加载的图片就多。服务器压力就会很大。不仅影响页面渲染速度还会浪费带宽。按照刚刚列表计算,并发情况下,达…
-
JavaScript是一个面向对象(原型对象)语言,除了一些基础类型,一切皆为对象,所有的对象都是函数(Function也是对象)创建的。 面向对象的继承等一些特性,像极了人类的传承和繁衍。我们先解释下 一切皆为对象:都是爹养娘生的 。对于JS原型链的鼻祖Object.prototype就像是人类的祖先一样,是其他物种进化而来的,…
-
浏览器插件是前端领域比较小众的应用范畴,我们所说的浏览器插件指的就是 Chrome 插件 。在 Chrome 插件市场 上有非常多 有趣 又 实用 的 Chrome 插件 ,比如 octotree (显示github代码树)、 Adblock Plus (拦截广告)等。 目前笔者接触 Chrome 插件 开发也有一年时间,最初团队中使用 原生js+jquery 的方式开发插件…
-
云开发JavaScript实战 | 如何使用 tcb-js-sdk 实现图片上传功能
tcb-js-sdk 让开发者可以在网页端使用 JavaScript 代码服务访问云开发的服务,以轻松构建自己的公众号页面或者独立的网站等 Web 服务。本文将以 实现图片上传功能 为例,介绍 tcb-js-sdk 的基本配置流程。你也可以在这里查到技术文档了解更多: cloudbase.net?from=10004 在使用云开发 Cloudbase 开发应用的过程中,…
-
搭建项目脚手架工程是架构师 必需必会的基础技能。 在脚手架的帮助下,我们只需要跑一个命令就可以生成一个项目,不需要再思考项目的目录结构,单元测试,所需要的依赖等繁琐的事情。 而伴随着前端工程体系的功能涵盖范围越来越广,封装的方案类型越来越多,对应的配置项越来越复杂, 脚手架的重要性正在逐渐突…
-
本人毕业到现在工作一年,一直在开发React项目,但在毕业之前的实习基本上都在用vue开发,前一段时间工作比较轻松,又因为好久没有写vue项目,所以想再去熟悉一下vue, 但是痴情的我,居然想看vue的源码,于是我就去慕课网上买了一门源码讲解的课.前后看了两遍,可能是我太笨了,没有多久就忘记的差不多了,所以我决定再去看第三遍,…
-
应用的导航需要“守卫” Vue-router中你点击一个按钮,移步到了另外一个“网页”中。这是经常发生的事情。 在这个移步的过程当中,其实我们拥有着很多机会对这个行为做一些事情。 例如:小明打算从家里去外婆家,你在路上可以把他的腿打断,送回家,这样你就阻止了他去外婆家了。 小明去外婆家就是导航,你就是导航…
-
<!– 1、props –> // child props: { msg: String } // parent <HelloWorld msg="Welcome to Your Vue.js App"/> 复制代码 <!– 2、$children –> // parent this.$children .xx = ‘xxx’ 复制代码 <!– 3、$refs –> // parent <HelloWorld ref="hw"/> mo…
-
VueCheckbox.vue <template lang="html"> <div> <input v-bind="$attrs" :checked="isChecked || $attrs.checked" :value="value" type="checkbox" v-on="listeners"> <span> &l…
-
效果 分析该过程,可拆分成两个步骤: 鼠标框选一段区域 判断框选区域包含的 checkbox,进行对应处理 HTML 和 CSS 布局 该布局基于 element-ui,一个父容器 box,里面一个 mask div,一个 el-checkbox-group 块。…
-
多个单独的构建应该形成一个应用程序。这些独立的构建不应该相互依赖,因此可以单独开发和部署它们。 这通常被称为微前端,但不限于此。 低级概念 我们区分本地和远程模块。本地模块是正常模块,是当前构建的一部分。远程模块是不属于当前构建的模块,并在运行时从所谓的容器加载。 加载远程模块被认为是异步操作。…
-
前两天一个同事跟我说了这么一个面试题,面试官上来就问他:“项目中用了babel还需要polyfill吗?” 开始他的内心是懵比的,怎么还有如此不按套路出牌的问题,按照面试的基本原则,答案一定是需要的,不然还怎么往下问啊。于是他说“要的”。当面试官深挖下去的时候他终于顶不住了。 其实平时开发的过程中用的大部分都是现成…
-
CSS Viewport 单位,很多人还不知道使用它来快速布局
点赞再看,养成习惯本文 GitHub [链接] 上已经收录,更多往期高赞文章的分类,也整理了很多我的文档,和教程资料。欢迎Star和完善,大家面试可以参照考点复习,希望我们一起有点东西。
-
前言: 为什么我们需要模块化开发,模块化开发的好处有哪些? 首先我们先说一下非模块化的开发方式带来的弊端。 非模块化开发中会导致一些问题的出现,变量和函数命名可能相同,会造成变量污染和冲突,并且出错时候很难排查。耦合程度高,不符合软件开发中的高内聚和低耦合的原则,所以我们就可以总结一下模块化开发的…
-
解决方式:在form层多了个onsubmit=”return false;”<el-form ref=”form” :model=”form” label-width=”80px” onsubmit=”return false;”>
-
由于JAVASCRIPT语言采用的是单线程模型,所有任务只能再一个线程上执行。早期得计算机是单核心所以没有问题。但是随着计算机能力得增强,特别是多核CPU的出现。单线程就带来很大的不便,无法充分发挥计算机的计算能力。 所以在HTML5的规范中提供了一个多线程的解决方案,这就是WEB-WORKER WEB-WORKER允许JAVASC…
-
前言 为了让大家更好地学习 Pipcook 和机器学习,我们准备了实战系列教程,会分别从前端组件识别、图片风格迁移、AI 作诗以及博客自动分类,这几个具体示例来讲解如何在我们日常开发中使用 Pipcook,如果需要了解 Pipcook 1.0,请阅读文章 AI :heart: JavaScript, Pipcook 1.0 。 背景 图片风格转换在一些…
-
欢迎加入前端交流群:749539640 jenkins介绍 构建伟大,无所不能 Jenkins是开源CI&CD软件领导者, 提供超过1000个插件来支持构建、部署、自动化, 满足任何项目的需要。 作为一个可扩展的自动化服务器,Jenki…
-
LeetCode 1122. 数组的相对排序:JavaScript 计数排序解法
这是一道排序的题目,那么我们首先应该想到一些常见的排序算法。主要分为两类,一类是基于比较的排序算法,例如快速排序和堆排序等。另一类是非基于比较的排序算法,包括计数排序和桶排序等。基于比较的排序算法的最优化时间复杂度也无法小于 。而非基于比较的排序算法则可以实现更低的时间复杂度。 基于比较的排序算…
-
很多网站为了实现推送技术,所用的技术都是轮询。轮询是在特定的的时间间隔(如每秒),由浏览器对服务器发出HTTP请求,然后由服务器返回最新的数据给客户端的浏览器。这种传统的模式带来很明显的缺点,即浏览器…
-
Vue、Nuxt服务端渲染、NodeJS全栈项目~面向小白的完美系统~
Hello,大家好,我是李白~~ 第一次发帖子,有点小紧张,不知道待会给我点赞的会是哪位帅气的哥哥,还是漂亮的姐姐呢,嘿嘿。 浪迹掘金之久,感谢各位大佬们的知识分享,感谢掘金这个平台,让我对自己的能力有了深度的认知,同时认识到诸位优秀、有趣的小伙伴们,请大家继续保持前进!!! 这是一个入门全栈之路的小…
-
原文:https://vuedose.tips/use-web-workers-in-your-vuejs-component-for-max-performance/ 有时开发者需要和一些“很重”的组件打交道 — 这通常是指由于执行了复杂的任务,所以创建和渲染开销都很大的组件。 比方说,我昨天就在使用“StoryBlok”工具库创建富文本编辑器的时候遇到了麻烦。 …
-
前言 在写这篇文章之前, 一直有个问题困扰着我, 什么是前端工程管理? 当我作为面试官和一些候选人聊这个话题的时候, 我得到的答案五花八门, 比如谈目录规范, 编码规范, 做个脚手架, 增加单元测试, CodeReview 等等, 我的直觉告诉我这些和前端工程管理有关系, 但这些一定不是前端工程管理的本质, 但是当我们理不清本质…
-
我们怎样用 Go 和 Vue 快速构建一个病患实时监控系统?
作者 | kasvith 译者 | 王强 策划 | 万佳 本文最初发布于 Kasvith 博客,经原作者授权由 InfoQ 中文站翻译并分享。 疫情爆发 2019 年 11 月,我们听说了来自中国的第一起未知致命疾病的病例。现在,人们都知道它是 Covid-19,并且它似乎永远改变了我们的生活。这种病毒是致命的,具…
-
本篇将带你深入理解 Flutter 开发过程中关于字体和文本渲染的“冷”知识,帮助你理解和增加关于 Flutter 中字体绘制的“无用”知识点。 毕竟此类相关的内容太少了 首先从一个简单的文本显示开始,如下代码所示,运行后可以看到界面内出现了一个 H 字母,它的fontSize是 100,Text被放在一个高度…
-
循序渐进VUE+Element 前端应用开发(14)— 根据ABP后端接口实现前端界面展示
ABP( ASP.NET Boilerplate )框架主要是基于.net core 进行的后端Web API的开发,结合Swagger的管理界面我们可以看到发布的 API 的接口明细信息,这样前端技术人员可以很容易整合前端的API应用。Vue + Element的前端应用,是目前较为流行的前端技术整合,Vue提供了前端框架很好的支持,Element提供了非常不错的界面组件…
更多内容请关注公众号【前端开发博客】每日更新