辜负寒彻骨
获得徽章 0
- #青训营笔记创作活动#
2023年2月15日打卡day29
今日学习：packge.json配置
package.json 是前端每个项目都有的 json 文件，位于项目的根目录。许多脚手架在搭建项目时也会自动帮我们自动初始化好 package.json。
package.json 里面有许许多多的配置，与项目息息相关，了解它们有助于了解项目，提效开发，规范代码。
今天主要介绍一些常见配置，可以分为7 大类：
描述配置
文件配置
脚本配置
依赖配置
发布配置
系统配置
第三方配置展开评论点赞 - #青训营笔记创作活动#
2023年2月14日打卡day28
今日学习：Tapable
Tapable是一个类似于 Node.js 中的 EventEmitter 的库，但它更专注于自定义事件的触发和处理。通过 Tapable 我们可以注册自定义事件，然后在适当的时机去执行自定义事件。
举个例子🌰：类比到 Vue 和 React 框架中的生命周期函数，它们就是到了固定的时间节点就执行对应的生命周期，tapable 做的事情就和这个差不多，我们可以通过它先注册一系列的生命周期函数，然后在合适的时间点执行。展开评论点赞 - #青训营笔记创作活动#
2023年2月13日打卡day27
今日学习：Js中map的使用时机
在 JavaScript 中，对象是很方便的。它们允许我们轻松地将多个数据块组合在一起。 在ES6之后，又出了一个新的语言补充-- Map。在很多方面，它看起来像是一个功能更强的对象，但接口却有些笨拙。
然而，大多数开发者在需要 hash map 的时候还是会使用对象，只有当他们意识到键值不能只是字符串的时候才会转而使用 Map。因此，Map 在当今的 JavaScript 社区中仍然没有得到充分的使用。
Map 比 Object 快，除非有小的整数、数组索引的键，而且它更节省内存。
如果你需要一个频繁更新的 hash map，请使用 Map；如果你想一个固定的键值集合（即记录），请使用Object，并注意原型继承带来的陷阱。
代码部署后可能存在的BUG没法实时知道，事后为了解决这些BUG，花了大量的时间进行log 调试，这边顺便给大家推荐一个好用的BUG监控工具 Fundebug。
展开评论点赞 - #青训营笔记创作活动#
2023年2月12日打卡day26
今日学习：Islands
Islands 架构模型早在 2019 年就被提出来了，并在 2021 年被 Preact 作者Json Miller 在 Islnads Architecture 一文中得到推广。这个模型主要用于 SSR (也包括 SSG) 应用，我们知道，在传统的 SSR 应用中，服务端会给浏览器响应完整的 HTML 内容，并在 HTML 中注入一段完整的 JS 脚本用于完成事件的绑定，也就是完成 hydration (注水) 的过程。当注水的过程完成之后，页面也才能真正地能够进行交互。
展开评论点赞 - #青训营笔记创作活动#
2023年2月10日 打卡day25
今日学习：docker
富 Web 时代，应用变得越来越强大，与此同时也越来越复杂。集群部署、隔离环境、灰度发布以及动态扩容缺一不可，而容器化则成为中间的必要桥梁。
docker 使应用部署更加轻量，可移植，可扩展，更好的环境隔离也更大程度地避免了生产环境与测试环境不一致的巨大尴尬。
Build once，Run anywhere!展开评论点赞 - #青训营笔记创作活动#
2023年2月9日打卡day24
今日学习：大屏适配
开发大屏的两方面：
1、前端的自适应适配
2、根据UI稿绘制图表，调细节
主要解决方案：
1、vm、vh
2、scale
3、rem+vm、vh展开评论点赞 - #青训营笔记创作活动#
2023年2月8日打卡day23
今日学习：前端低代码项目
近几年，在技术领域低代码是比较热门的话题，比如阿里云推出了易搭，通过简单的拖拽、配置，即可完成业务应用的搭建，腾讯云则是推出了微搭，通过行业化模板、拖放式组件和可视化配置快速构建多端应用。
低代码是基于可视化和模型驱动理念，结合云原生与多端体验技术，它能够在多数业务场景下实现大幅度的提效降本，为专业开发者提供了一种全新的高生产力开发范式。下面就来分享几个值得学习和使用的低代码开源项目，更深入地了解什么是低代码
Appsmith
LowCodeEngine
Amis
tmagic-editor展开评论点赞 - #青训营笔记创作活动#
2032年2月7日打卡day22
今日学习：高性能的树状结构
一般的树状结构是每层数组中的item都有一个children，里面嵌套的子item也有各自的children无限嵌套！！
而拍扁后的树状结构是一个对象，每个item都扁平化平铺在第一层，每一个item都有各自的parentId和childrenIds
可以发现将整个结构扁平化后收益特别多。
结构很清晰，我们可以很轻易的对数据进行处理。
特别是在特别大数据量的情况下，这种形式可以极大的提高性能，减去需要遍历的性能消耗。
以前各种在数组对象出现的弊端都消失了。
一句话概括：
用数据扁平化+虚拟Dom，实现区域更新，数据增删改查用并查集或BFS展开评论点赞 - #青训营笔记创作活动#
2023年2月6日打卡day21
今日学习：为什么选择pnpm，而不是npm/yarn
1、什么是pnpm？
pnpm是一个包管理器，这一点和npm/yarn一样，优势在于：
包的安装速度极快，比npm快两到三倍
磁盘空间利用非常高效
2、依赖管理：
npm1、2使用的是递归依赖，npm3和yarn采用扁平化依赖管理。而pnpm消除依赖提升，规范拓扑结构-使用软链接将包和依赖放在同一个node_module下面。
3、安全问题
npm和yarn的bug依旧依赖提升的坑展开评论点赞 - #青训营笔记创作活动#
2023年2月5日打卡day20
今日学习：前端实现羊了个羊
地图模拟：一个卡片包含四个矩阵元素，一层为一个矩阵
地图生成：最基础的生成只考虑当前层，只要不出现同层卡片堆叠即可。但其实卡片的方式有一定规律：左右对称、从顶层到底层越中心卡片越少、上一层不会完全覆盖下一层
覆盖关系：初始化二维数组coverMap
填充数据：
1、保证是3的倍数
2、填充卡片类型展开评论点赞