柒刻
编程爱好者/互联网从业者/知识分享博主/记录过程，分享心得
获得徽章 3
#青训营笔记创作活动#
2月15 打卡day30
今日学习
本文讲解 Qiankun 框架中的 JavaScript 沙箱原理以及如何实现隔离。Qiankun 是一个微前端解决方案，它允许我们将多个子应用程序组合在一起以形成一个整体。每个子应用程序都是由一个 JavaScript 沙箱隔离的，这样可以避免不同应用程序之间的命名冲突和数据交叉污染。
在 Qiankun 中，每个子应用程序都有一个独立的 JavaScript 上下文，它们之间是隔离的。这是通过使用浏览器提供的 iframe 元素实现的。每个子应用程序都在一个 iframe 中运行，并且只能访问其自己的 JavaScript 上下文。这意味着在一个子应用程序中定义的变量或函数不会对其他子应用程序产生影响。
此外，Qiankun 还为每个子应用程序提供了一个自定义的 JavaScript 沙箱，该沙箱使用了一些技术来确保应用程序之间的隔离。这些技术包括使用 iframe 进行隔离、使用 MutationObserver 来观察 DOM 变化、使用 Proxy 来代理对象等。
总之，JavaScript 沙箱是一种实现前端应用程序隔离的有效方式，它可以有效地避免应用程序之间的命名冲突和数据交叉污染。在 Qiankun 中，使用 iframe 和一些技术实现 JavaScript 沙箱，为子应用程序提供了更加完善的隔离和保护。
2月15 打卡day30
今日学习
本文讲解 Qiankun 框架中的 JavaScript 沙箱原理以及如何实现隔离。Qiankun 是一个微前端解决方案，它允许我们将多个子应用程序组合在一起以形成一个整体。每个子应用程序都是由一个 JavaScript 沙箱隔离的，这样可以避免不同应用程序之间的命名冲突和数据交叉污染。
在 Qiankun 中，每个子应用程序都有一个独立的 JavaScript 上下文，它们之间是隔离的。这是通过使用浏览器提供的 iframe 元素实现的。每个子应用程序都在一个 iframe 中运行，并且只能访问其自己的 JavaScript 上下文。这意味着在一个子应用程序中定义的变量或函数不会对其他子应用程序产生影响。
此外，Qiankun 还为每个子应用程序提供了一个自定义的 JavaScript 沙箱，该沙箱使用了一些技术来确保应用程序之间的隔离。这些技术包括使用 iframe 进行隔离、使用 MutationObserver 来观察 DOM 变化、使用 Proxy 来代理对象等。
总之，JavaScript 沙箱是一种实现前端应用程序隔离的有效方式，它可以有效地避免应用程序之间的命名冲突和数据交叉污染。在 Qiankun 中，使用 iframe 和一些技术实现 JavaScript 沙箱，为子应用程序提供了更加完善的隔离和保护。
展开
评论
点赞
#青训营笔记创作活动#
2月14 打卡day29
今日学习
package.json 是前端每个项目都有的 json 文件，位于项目的根目录。许多脚手架在搭建项目时也会自动帮我们自动初始化好 package.json。
2月14 打卡day29
今日学习
package.json 是前端每个项目都有的 json 文件，位于项目的根目录。许多脚手架在搭建项目时也会自动帮我们自动初始化好 package.json。
展开
评论
点赞
#青训营笔记创作活动#
2月13日 打卡day28
今日学习
"Day 28" 介绍了中级/高级前端开发人员为什么应该读一读 Tapable 源代码的问题。这篇文章详细介绍了 Tapable 的原理，并阐明了 Tapable 对于前端开发人员的重要性。它还提供了一些实践的指导，帮助前端开发人员更好地理解和使用 Tapable。最后，文章总结了 Tapable 对于前端开发人员的重要影响，并强烈建议读者读一读 Tapable 源代码以提高自己的开发能力。
2月13日 打卡day28
今日学习
"Day 28" 介绍了中级/高级前端开发人员为什么应该读一读 Tapable 源代码的问题。这篇文章详细介绍了 Tapable 的原理，并阐明了 Tapable 对于前端开发人员的重要性。它还提供了一些实践的指导，帮助前端开发人员更好地理解和使用 Tapable。最后，文章总结了 Tapable 对于前端开发人员的重要影响，并强烈建议读者读一读 Tapable 源代码以提高自己的开发能力。
展开
评论
点赞
#青训营笔记创作活动#
2月12日 打卡day27
今日学习
Day 27" 讨论了 JavaScript 中使用 Map 和 Object 的情况。在 JavaScript 中，Map 和 Object 都是用来存储键值对数据的数据结构。但是，它们有一些显著的差异。Map 更适合存储任意类型的键，而 Object 只能存储字符串类型的键。此外，Map 更容易遍历和维护，因为它的键值对是有序的。相比之下，Object 的键值对是无序的。因此，当需要存储任意类型的键并且需要更方便的遍历和维护时，建议使用 Map。
2月12日 打卡day27
今日学习
Day 27" 讨论了 JavaScript 中使用 Map 和 Object 的情况。在 JavaScript 中，Map 和 Object 都是用来存储键值对数据的数据结构。但是，它们有一些显著的差异。Map 更适合存储任意类型的键，而 Object 只能存储字符串类型的键。此外，Map 更容易遍历和维护，因为它的键值对是有序的。相比之下，Object 的键值对是无序的。因此，当需要存储任意类型的键并且需要更方便的遍历和维护时，建议使用 Map。
展开
评论
点赞
#青训营笔记创作活动#
2月11日 打卡day25
今日学习
【Day 26】介绍了Islands架构的原理和实践。文章介绍了Islands架构的基本概念，该架构如何在前端开发中应用，以及实现该架构的最佳实践。文章还探讨了Islands架构的优点，例如提高团队的协作效率、减少代码冗余和提高维护性。通过这篇文章，前端开发者可以更好地了解Islands架构，并将其应用到实际的前端项目中。
2月11日 打卡day25
今日学习
【Day 26】介绍了Islands架构的原理和实践。文章介绍了Islands架构的基本概念，该架构如何在前端开发中应用，以及实现该架构的最佳实践。文章还探讨了Islands架构的优点，例如提高团队的协作效率、减少代码冗余和提高维护性。通过这篇文章，前端开发者可以更好地了解Islands架构，并将其应用到实际的前端项目中。
展开
评论
点赞
#青训营笔记创作活动#
2月10日 打卡day25
今日学习
"Day 25"涵盖了前端开发人员使用Docker的指南的主题。该文章旨在介绍Docker的基础知识及其在前端开发中的使用。它涵盖了如何安装Docker、如何创建和管理容器、如何在容器中运行前端应用程序以及如何使用Docker部署前端应用程序等主题。文章还介绍了在前端开发中使用Docker的最佳实践，例如如何组织容器、如何管理依赖关系以及如何优化性能。通过这个指南，前端开发人员可以学习如何使用Docker改善他们的开发和部署流程，使他们的工作更有效率和流畅。
2月10日 打卡day25
今日学习
"Day 25"涵盖了前端开发人员使用Docker的指南的主题。该文章旨在介绍Docker的基础知识及其在前端开发中的使用。它涵盖了如何安装Docker、如何创建和管理容器、如何在容器中运行前端应用程序以及如何使用Docker部署前端应用程序等主题。文章还介绍了在前端开发中使用Docker的最佳实践，例如如何组织容器、如何管理依赖关系以及如何优化性能。通过这个指南，前端开发人员可以学习如何使用Docker改善他们的开发和部署流程，使他们的工作更有效率和流畅。
展开
评论
点赞
#青训营笔记创作活动#
2月9日 打卡day24
今日学习
“Day 24”涵盖了了解数据仪表板适配解决方案（vw/vh、rem 和 scale）的主题。本文对每个解决方案及其用例进行了深入解释。作者介绍了基于视口宽度和高度的 vw/vh 单位，用于相对于视口调整元素的大小。然后，作者介绍了rem单位，它是基于根元素font-size，用来相对于根元素的font-size来调整元素大小的。最后，作者介绍了缩放解决方案，它基于应用于文档中所有元素的缩放因子，用于使布局适应不同的屏幕尺寸。本文对三种解决方案进行了比较，并强调了它们的优缺点.
2月9日 打卡day24
今日学习
“Day 24”涵盖了了解数据仪表板适配解决方案（vw/vh、rem 和 scale）的主题。本文对每个解决方案及其用例进行了深入解释。作者介绍了基于视口宽度和高度的 vw/vh 单位，用于相对于视口调整元素的大小。然后，作者介绍了rem单位，它是基于根元素font-size，用来相对于根元素的font-size来调整元素大小的。最后，作者介绍了缩放解决方案，它基于应用于文档中所有元素的缩放因子，用于使布局适应不同的屏幕尺寸。本文对三种解决方案进行了比较，并强调了它们的优缺点.
展开
评论
点赞
#青训营笔记创作活动#
2月8日 打卡day23
今日学习
这是一篇推荐 20 个开源前端低代码项目的文章。文章列出了当前最受欢迎和实用的前端低代码项目，包括对于快速开发、界面设计和交互操作等方面的支持。这些项目为前端开发人员提供了一种简单而高效的方法，以实现其开发目标，并将其时间和精力专注于项目的核心业务逻辑。这些开源前端低代码项目的推荐有助于前端开发人员提高其开发效率和项目质量。
2月8日 打卡day23
今日学习
这是一篇推荐 20 个开源前端低代码项目的文章。文章列出了当前最受欢迎和实用的前端低代码项目，包括对于快速开发、界面设计和交互操作等方面的支持。这些项目为前端开发人员提供了一种简单而高效的方法，以实现其开发目标，并将其时间和精力专注于项目的核心业务逻辑。这些开源前端低代码项目的推荐有助于前端开发人员提高其开发效率和项目质量。
展开
评论
点赞
#青训营笔记创作活动#
2月7日 打卡day22
今日学习
渲染
就拿react来举例，我们一般渲染一个列表都是通过map进行遍历渲染，拿到对应的item通过itemRender()来处理对应的ReactNode，在渲染中其实两种状态的使用相差不大。
2月7日 打卡day22
今日学习
渲染
就拿react来举例，我们一般渲染一个列表都是通过map进行遍历渲染，拿到对应的item通过itemRender()来处理对应的ReactNode，在渲染中其实两种状态的使用相差不大。
展开
评论
点赞
#青训营笔记创作活动#
2月5日 打卡day21
今日学习
"Day 21" 涵盖了关于现代包管理器的深入思考的主题。文章讨论了为什么现在推荐pnpm而不是npm/yarn。这个讨论基于不同的包管理器的优缺点，包括它们的性能、稳定性和其他功能。作者对pnpm的优缺点进行了全面的分析，并将其与npm/yarn进行了比较。总之，文章解释了为什么pnpm是现代前端开发的更好选择，并为前端开发人员提供了决策使用哪个包管理器的见解。
2月5日 打卡day21
今日学习
"Day 21" 涵盖了关于现代包管理器的深入思考的主题。文章讨论了为什么现在推荐pnpm而不是npm/yarn。这个讨论基于不同的包管理器的优缺点，包括它们的性能、稳定性和其他功能。作者对pnpm的优缺点进行了全面的分析，并将其与npm/yarn进行了比较。总之，文章解释了为什么pnpm是现代前端开发的更好选择，并为前端开发人员提供了决策使用哪个包管理器的见解。
展开
评论
点赞
#青训营笔记创作活动#
2月4日 打卡day20
今日学习
"Day 20" 涵盖了纯前端实现「羊了个羊」小游戏的主题。 这个游戏可以使用HTML、CSS和JavaScript构建，允许前端开发人员展示他们创建交互式和动态用户体验的技能。 要实现游戏，需要对前端开发的基础有很好的了解，例如HTML结构、CSS样式和JavaScript事件和函数。 对游戏开发原则的扎实理解，例如游戏循环、计分和碰撞检测，也是必要的。 有了这些技能和知识，前端开发人员可以将「羊了个羊」游戏带入生活，用他们的创造力和技术能力给用户留下深刻印象。
2月4日 打卡day20
今日学习
"Day 20" 涵盖了纯前端实现「羊了个羊」小游戏的主题。 这个游戏可以使用HTML、CSS和JavaScript构建，允许前端开发人员展示他们创建交互式和动态用户体验的技能。 要实现游戏，需要对前端开发的基础有很好的了解，例如HTML结构、CSS样式和JavaScript事件和函数。 对游戏开发原则的扎实理解，例如游戏循环、计分和碰撞检测，也是必要的。 有了这些技能和知识，前端开发人员可以将「羊了个羊」游戏带入生活，用他们的创造力和技术能力给用户留下深刻印象。
展开
评论
点赞
#青训营笔记创作活动#
2月3日 打卡day19
今日学习
今天学习的是前端应该掌握的浏览器调试技巧。这是一项非常重要的技能，因为前端开发往往需要在不断地调试代码和修复问题，以确保网站或应用程序正常运行。通过掌握浏览器调试技巧，前端开发人员可以更有效地诊断问题，并缩短调试时间。
2月3日 打卡day19
今日学习
今天学习的是前端应该掌握的浏览器调试技巧。这是一项非常重要的技能，因为前端开发往往需要在不断地调试代码和修复问题，以确保网站或应用程序正常运行。通过掌握浏览器调试技巧，前端开发人员可以更有效地诊断问题，并缩短调试时间。
展开
评论
点赞