- 博客(34)
- 收藏
- 关注
原创 9-框架-Angular
自定义组件时的属性实现调用时绑定value:如果希望自定义组件能够具有与表单元素相同的 ngModel 效果,可以通过在组件内实现 ControlValueAccessor 接口达到目的。ControlValueAccessor约束最简实现示例参考如下import {import {if(v!if(value!} }
2023-04-11 09:17:57
241
1
原创 6-基础-ESX
这一篇代码量偏重一些,从ES6从TypeScript是日常工作中陪伴开发者最多的,开发能力很大程度上指的也是JS能力,所以此处也考验以下动手能力。面向对象的 ECMAScript 语法标准:化繁为简:在 ECMAScript 2022(ES13) 新增的 Array.prototype.at()、Object.hasOwn()、
2023-03-27 09:21:10
206
原创 5-基础-CSS
实现精美页面是前端工程师的核心能力之一,CSS布局技术是实现精美页面的核心技术,但CSS布局好入门,难精通。随着用户审美标准越来越高,前端页面对精美度、实用性要求越来越高,深度掌握CSS布局,可更快提升竞争力。
2023-03-13 15:03:21
202
原创 企业级价值观汇总
最近在整理一些团队文化的一些内容,其中就扩展到了企业文化这个层面,为了借鉴了一些优秀企业价值观案例,特整理一些素材,此文是基于此契机顺手整理了当下大部分名企的价值观信息,开放共享。这篇文章内容可能不够严谨,大多是来自网上信息的一些整理,如果读者发现有错误处还请指正。
2023-03-13 09:19:28
3249
原创 为什么是虚拟DOM
在Vue项目开发时,推荐使用模版语法,因为模版语法比直接使用虚拟DOM更加直观(虚拟DOM比模版语法更加灵活)。模版语法需要通过编译器转换成虚拟DOM,再使用渲染器渲染成真实的DOM节点,而虚拟DOM较传统的innerHTML最大的优势是数据更新节段,它紧紧更新变化的部分,性能消耗更小。在权衡了性能消耗、代码的可维护性,Vue(包括React等)主流框架,使用了虚拟DOM这个概念。当然这也仅仅是其中的一部分使用的理由,因为还有响应式等等。
2023-03-12 10:00:00
98
原创 「推荐收藏」提高组件库Level必做好这六件事
无论是刚参与到组件库开发、正处在组件库开发期间还是在使用组件库过程中都有考虑,倾力打造一款优秀体验的组件库,在组件库的工程化方面和组件开发当中还有哪些可以提升体验的地方欢迎一起讨论~
2023-03-11 09:45:00
123
原创 脚手架项目开发小手册
简单来说,「前端脚手架」就是指通过选择几个选项快速搭建项目基础代码的工具。脚手架可以帮助我们快速生成一套指定的项目结构和配置,最常用的方式就是我们提前准备好一套通用的、易用的、规范的项目模板存放在指定位置,在脚手架执行创建项目命令的时候,直接将 **准备好的模板 **拷贝到目标目录下。修改 package.json 中的 bin 参数,专门放置用户的自定义命令,指定可执行文件的位置,bin 里的命令是可执行命令,模块安装的时候如果是全局安装,则 npm 会为 bin 中配置的文件创建一个。
2023-03-10 09:14:33
263
原创 Web前端安全系列之:XSS攻防
Web 攻击技术的发展也可以分为几个阶段。在Web 1.0时代,人们更多的是关注服务器端动态脚本的安全问题,比如将一个可执行脚本(俗称webshell)上传到服务器上,从而获得权限。后续有出现了SQL注入,SQL注入的出现是Web安全史上的一个里程碑,SQL注入漏洞至今仍然是Web安全领域中的一个重要组成部分。再后续另一个里程碑的安全问题问世–XSS(跨站脚本攻击)。伴随着Web 2.0的兴起,XSSCSRF等攻击已经变得更为强大。Web攻击的思路也从服务器端转向了客户端,转向了浏览器和用户。
2023-03-09 09:28:36
363
原创 4-基础-HTML
自定义组件 ≠ HTMLUnknownElementHTML自定义组件的实现基于 window.customElements.define()接口< script > // 组件定义 class TextDemo extends HTMLElement {super();
2023-03-07 09:09:38
59
原创 从babel编译原理到vue源码的抽象语法树
本文以上就是 Vue 中 AST抽象语法树 的主干部分,最精彩的部分莫过于是 栈 和 双指针的解决问题的思路,希望读完这篇文章,你对栈和指针的算法会有一个新的认识。
2023-03-06 09:35:48
626
原创 浅谈规则引擎在前端的应用
规则引擎常作为一个独立服务运行在一定体量的产品之中,通过接收有效的数据来做出对业务的合理决策。在前端项目的常年迭代下,对于某些重要的或频繁扩展改造的业务模块由于时间长、注释少、不易阅读等客观问题的遗留会对后期的迭代造成一定困扰,也不免会造成额外的测试压力。所以轻量的、可运行在浏览器端得规则引擎将彻底消灭这样问题的存在。这里使用对象来表示一个Fact使用开源规则引擎可以实现在复杂逻辑处的优化处理,配合可视化的方案可以更方便的阅读引擎规则。上面的案例只是对。
2023-03-06 09:32:02
2019
1
原创 前端必会的图片加载方法
前端图片显示加载是网站很重要的一部分,很多网站图片占用了很大的空间,网站的性能的好坏也是给用户不同的体验,好的体验感会增加用户的“幸福感”。现在很多网站中图片往往占用了很大的资源,如果图片过大,加载效率低下,占用更多资源,加载显示不完整,使用者的观感上会不舒服。那么就让我们简单了解一下前端图片加载都会用到哪些方法。前端图片加载的方式有很多,应用场景也会不一样。
2023-03-05 09:00:00
3443
4
原创 前端进阶必备技能-JS位运算
以上的例子在平常可能会比较容易用到或看到,也是属于比较容易理解的。一些比较复杂的、难理解的,对于我来说,觉得应该尽量少用,因为会给自己带来麻烦。但是巧妙的使用位运算可以大量减少运行开销,优化算法。我们都知道计算机存储的都是二进制数据,这是由计算机本身的设计决定的。
2023-03-04 09:00:00
751
原创 前端脚手架的概要设计
随着前端工程化的理念不断深入,脚手架的出现就是为减少重复性工作而引入的命令行工具,众所周知, 新建项目是很繁琐的一项工作, 要考虑项目目录结构,基础库的配置, 各种规范等等. 在此过程中如何摆脱ctrl + c, ctrl + v,而通过脚手架从零到一搭建项目的方式变得更加有必要.另外,对于很多系统,他们的页面相似度非常高,所以就可以基于一套模板来搭建,虽然是不同的人开发,但用脚手架来搭建,相同的项目结构与代码书写规范,是很利于项目的后期维护的;
2023-03-03 09:00:00
391
原创 针对Axios的封装与NPM包发布
axios 是一个基于 promise 网络请求库,作用于node.js 和浏览器中。它是 isomorphic 的(即同一套代码可以运行在浏览器和node.js中)。在服务端它使用原生 node.js http 模块, 而在客户端 (浏览端) 则使用XMLHttpRequests。特性:· 从浏览器创建 XMLHttpRequests· 从 node.js 创建http请求· 支持 Promise API· 拦截请求和响应· 转换请求和响应数据· 取消请求· 自动转换JSON数据。
2023-03-02 09:32:03
461
原创 图解vue3.0编译器核心原理
Vue.js作为目前最流行的前端框架之一,一些概念和原理还是需要我们前端开发人员了解与深入理解的。Vue.js涉及的知识点很多,一些重要概念,例如:如何使用proxy实现响应式effect,虚拟DOM的Diff算法及演变过程(双端Diff算法、快速Diff算法等),渲染器原理的实现,编译器、解析器的工作原理,动态节点、静态提升等等;
2023-03-01 14:01:24
243
原创 3-知识体系
前端知识体系即前端技术领域的结构化思维与专业知识总和的概括,是一个管理学技术名词,领域指定了前端范围。知识体系体现了你对一个行业的了解程度,体系通常长这样:“❉”,即一个领域有多少分支,每个分支又有多少子分支,每个子分支又有多少知识点……,依次扩展开来便形成了一张庞大的技术图谱(文件太大文末附)。另外我们可以从当前技术生态形成自己的体系,比如当下主流技术范围、涉及运行环境、终端产品类型。总之不论从哪个角度出发你要知道所接触的事物如何分类,在体系中占据的什么位置,权重大小等等。
2023-03-01 10:03:03
78
原创 2-开篇阅读
当下国内最流行的前端框架当属Vue,语言当属TypeScript,所以无论涉及技术的哪个领域这两块都是绕不开的,甚至可以说会使用Vue+TypeScript开发项目已经成为了前端入门的基础知识了,所以当你在面试时仍然再说Vue的Object.defineProperty或者Proxy,可能当时的面试官已经听过无数遍这样的话了,那你又如何变得与众不同,如何在高薪HC的激烈竞争中脱颖而出呢?身边很多这种消费主义陷阱,这涉及自身的心智成熟与正确的三观引导,这个是大前提,格局的大前提,也是做人的大前提。
2023-02-28 14:02:13
46
原创 1-阅读指南
前端入门基础知识网上很多,比如:盒模型、样式权重、CSS选择器、闭包、原型等等,在本专栏内容里不再赘述这些(字又多又没含量),基础薄弱者建议先到网上过遍入门知识,本栏目更适合具有基础不错又有几年工作经验的人阅读,我们在这里分享迈向高级前端过程中需要拥有的知识储备、以及学到的一些经验及解决方案,希望能够帮助到有同样困惑、有同样需求的同学。同时,这不是一本手把手的文章汇总,而是循序渐进介绍一些高级知识点与决策的思路及部分示例代码。
2023-02-28 13:59:30
45
原创 《你的人生才刚刚开始》
我们即将推出《高级前端成长之路》系列,包含了成长为高级前端的必备知识,专为渺茫、彷徨时期仍有志改变世界的人定制的突破指南,旨在帮助大家快速成长,少走弯路。
2023-02-28 13:54:06
60
原创 一文读懂对JavaScript函数式编程的初认识
如越来越函数式的ES6,新的规范有非常多的新特性,其中不少借鉴其他函数式语言的特性,给JavaScript语言添加了不少函数式的新特性。箭头函数是提供词法作用域的匿名函数。如果我们将核心代码更换成较为合理的函数式逻辑,或者使用函数式工具和规范对已有逻辑进行归纳,就可以明显提高代码的可读性和代码运行时的可调试性,这也是对历史代码进行升级、改造的方法之一。函数式编程作为一种高阶编程范式,更接近于数学和代数的一种编程范式,与面向对象的开发理念和思维模式截然不同,深入理解这种差异性,是程序员进阶的必经之路。
2023-02-28 09:53:00
86
原创 教你如何衡量一个网页的性能
在这一篇中我们介绍了几个在网页性能紧相关的几项指标,也介绍了从毫秒到纳秒的性能数据获取的 API 和使用的方式,期间我们也演示了通过浏览器提供的功能,Chrome 浏览器还内置了 Lighthouse 功能来为我们的网页性能打分。我们通常也可以完全应用这两个工具,那么在需要定制一些私有的性能监控平台的时候 API 就可以发挥更大的功能了。
2023-02-28 09:30:00
619
原创 教你如何衡量一个网页的性能
在这一篇中我们介绍了几个在网页性能紧相关的几项指标,也介绍了从毫秒到纳秒的性能数据获取的 API 和使用的方式,期间我们也演示了通过浏览器提供的功能,Chrome 浏览器还内置了 Lighthouse 功能来为我们的网页性能打分。我们通常也可以完全应用这两个工具,那么在需要定制一些私有的性能监控平台的时候 API 就可以发挥更大的功能了。
2023-02-27 16:02:23
412
7
原创 WEB项目部署发版-通知用户在线更新方案
由于是单页面应用,用户一进入网站,就会把HTML与相对应的资源利用浏览器的缓存机制,停留在本地,这样的好处,就是再次进入网站,可以利用缓存机制,可快速进入网站。这也就造成了我们项目版本迭代后,用户因缓存机制,会继续使用旧迭代版本,需要用户手动刷新去服务器请求获取新的HTML,来使用新迭代版本。用户手动刷新获取新版本html(需要在nginx 配置,在nginx.conf文件做设置,让 index.html 不缓存)需求项目迭代后,用户使用会有版本更新的提示或者自动刷新,实现版本升级用户有感知方案。
2023-02-27 09:30:00
836
原创 扒官方文档学Ts类型编程(二)
至此TypeScript类型编程的7大块内容就已经过了一遍了,模板字符类型的案例还需要多熟悉熟悉。在官网还有一些提供的内容类型工具可以直接供我们在实际开发中使用,这里给出的地址方便大家查询。类型编程和我们以往的编程一样,同样在乎基础的学习和大量的练习。上次推荐的开源类型挑战项目你有练习打卡吗?
2023-02-26 10:00:00
155
原创 扒官方文档学Ts类型编程(一)
泛型的特点就是通用;反应的语法:,其中T是通配符,常见的通配符还有K,U等,下面代码中的Type也是通配符;在下面执行identity时通过泛型约束了传入类型为string,那么按函数功能返回的类型也将是string,可以点击进入演练场验证答案;return arg;return arg;return arg;
2023-02-25 09:45:00
180
原创 《你的人生才刚刚开始》
我们即将推出《高级前端成长之路》系列,包含了成长为高级前端的必备知识,专为渺茫、彷徨时期仍有志改变世界的人定制的突破指南,旨在帮助大家快速成长,少走弯路。
2023-02-24 16:37:46
98
原创 【解决】前端开发中的5大痛点
如何优雅且快速的切换Node版本?如何统一项目中包管理器的使用?如何养成规范GitCommit编写习惯?如何不Copy快速开发相似的页面/组件?如何编写CSS会让同事更愿意阅读?;;;。通过在install正式执行前通过在进程中获取可以区别当前使用的包管理器的特殊标识来决定是允许还是中断执行。husky7:在git执行的生命周期进行hook,替代git自带的hooks;commitizen/cz-cli:通过交互的方式生成规范的GitCommit信息;
2023-02-24 15:06:12
514
3
原创 打造BPMN2.0的业务流程引擎
bpmn.js是一个BPMN 2.0渲染工具包和web建模器。它是用JavaScript编写的,将BPMN 2.0 图表嵌入在浏览器中, 并独立于后端, 这也使得将其嵌入到任务Web应用程序中变得很容易: 可以独立使用也可以集成到你的应用中。该库的构建方式既可以是查看器,也可以是Web建模器使用查看器(Viewer)将BPMN 2.0 嵌入到应用程序中,并用系统数据丰富其查看器。使用建模器(Modeler) 在应用程序中创建BPMN 2.0 图表。
2023-02-24 13:34:32
887
原创 基于qiankun的微服务落地实践
qiankun 是一个基于single-spa的微前端实现库,旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。qiankun 孵化自蚂蚁金融科技基于微前端架构的云产品统一接入平台,在经过一批线上应用的充分检验及打磨后,我们将其微前端内核抽取出来并开源,希望能同时帮助社区有类似需求的系统更方便的构建自己的微前端系统,同时也希望通过社区的帮助将 qiankun 打磨的更加成熟完善。目前 qiankun 已在蚂蚁内部服务了超过 200+ 线上应用,在易用性及完备性上,绝对是值得信赖的。
2023-02-23 14:59:11
514
1
原创 探索行为可回溯系统的应用与实现
行为可回溯系统最先出现于保险销售行业,对其定义和范围是指 **保险机构通过销售页面管理和销售过程记录等方式,对在自营网络平台上销售保险产品的交易行为进行记录和保存,**使其可供查验。通过这种方式减少线上销售模式的风险及其问题的出现并在问题出现后可以很快的找到对应的因素。行为可回溯系统为我们后期提供有效的图片、音频或者视频相关的有效资料,以便调查,检查使用。
2023-02-23 14:21:09
430
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人