Dvorak
Dvorak

Dvorak Chen

All Posts


组件化-组件的兼容性

本篇博客主要探讨了组件化开发中的一个重要问题:组件的兼容性。首先,博客讲解了组件化的概念和其在前端框架如React中的实现,以及传统HTML编程中的局限性。然后,博客讨论了在组件化开发中,如何通过暴露接口和受父级元素的限制,提高组件的兼容性,使得组件在各个环境中有稳定和灵活的表现。同时,博客也指出了在编写组件样式时需要注意的问题,如CSS属性的设置和计算方式等。这篇博客的讨论,对于想要在组件化开发中提高代码质量和开发效率的开发者来说,具有很高的参考价值。你是否也遇到过类似的问题?又是如何解决的呢?--GPT 4

Javascript

组件化-使用 Cypress 测试组件

这篇博客详细介绍了如何使用 Cypress 进行组件测试的全过程。首先,作者解释了为什么在开发组件库时,采用 Cypress 这样的可视化测试套件是一个好选择。接着,作者详细演示了如何安装和配置 Cypress,包括如何选择前端框架和打包工具,如何安装所需的包,以及如何在 Cypress 的窗口中进行配置。之后,作者详细介绍了 Cypress 的查询和断言功能,以及如何使用它们进行组件测试。作者还分享了 Cypress 的一些最佳实践,如不要使用变量存放查询到的组件,不要使用查询元素、类名、ID来获取组件等。这篇博客是一篇很好的 Cypress 组件测试教程,无论你是初学者还是有经验的开发者,都能从中学到很多。那么,你准备好尝试使用 Cypress 进行组件测试了吗?--GPT 4

Javascript

在前端开发中使用 Mock

本篇博文主要讲述了在前端开发中如何使用 Mock 技术来模拟 API 的请求和响应。文章首先解释了 Mock 技术的定义,即用于拦截请求,并可以使用 mock 定义的响应数据来返回,常用在开发、测试环境中。接着,作者详细介绍了如何安装和配置 msw,一个用于 mock 的工具。其中包括新建 mocks 文件夹,编写 handlers 文件以定义哪些接口需要 mock,以及如何返回假数据。然后,文章描述了如何拦截浏览器的请求,并在项目启动时启动 mock 服务。最后,作者通过一个实际的例子,演示了如何在应用中发送请求并获取 mock 的数据。这篇文章对于想要在前端开发中使用 mock 技术的读者来说,是一篇很好的指导文章。你是否了解过 Mock 技术?你是否知道如何在前端开发中使用它来模拟 API 请求和响应?你知道如何配置 msw 来定义哪些接口需要 mock 吗?阅读全文,你将找到答案。--GPT 4

Javascript

CSS 编写赛博效果的 LOGO

这篇博客主要讲述了如何使用CSS和SVG来创建一个赛博风格的Logo。作者首先通过一段SVG代码创建了一个基本的Logo形状,然后通过CSS的绝对定位和透明度调整,将三张Logo图像叠加在一起,从而达到边缘效果。然后,作者通过调整SVG的fill属性以改变颜色,并使用CSS的`mix-blend-mode`属性来指定图像的混合模式,使得颜色更加丰富。最后,作者通过CSS动画实现了颜色的循环变化,使得Logo动态起来。你能否想象出这个Logo的最终效果?或者,你可以尝试使用这种方法来创建自己的Logo吗?--GPT 4

css

React 单元测试

这篇博客主要介绍了如何对React组件进行单元测试。首先,使用`@testing-library/react`的`render`和`fireEvent`方法模拟组件的加载和点击事件。然后,通过`getByTestId`和`queryByRole`方法获取元素,进行断言判断。此外,博客还介绍了如何使用`vitest`和`msw`库进行mock测试,以及如何解决多次测试时的组件重复加载问题。博客的最后部分提供了完整的测试代码示例和参考资料链接。这篇博客不仅教你如何进行React组件的单元测试,还引导你思考如何优化测试流程,提高测试效率。你是否有过在进行React组件测试时遇到困难的经历?对于博客中介绍的方法,你又有哪些自己的见解和改进意见呢?--GPT 4

Javascript

如何开发npm包并使用rollup打包

这篇博客主要讲述了如何开发npm包并使用rollup打包。首先,假设你已经熟悉了npm、ts以及有一些React开发经验。文章中详细介绍了打包工具rollup的使用,包括它的优势、官网链接、如何使用配置文件方式运行rollup等。接着,通过一个实例展示了如何使用rollup打包一个React组件,包括相关配置、代码示例等。文章还详细讲述了如何发布npm包,包括发布条件、如何发布、发布后的问题、如何解决这些问题等。最后,文章介绍了如何使用rollup打包工具,包括安装、配置、插件使用等。文章最后提出了一个问题:rollup还有哪些其他的用法和插件?你可以在rollup官网上找到答案。--GPT 4

Javascript

石头雨 - 其一

这篇博客以一个人的一天生活为主题,讲述了他如何在周六的一天中过得迷茫和无聊。文章从早晨开始,描绘了他起床后的各种行动和思考,包括看视频、玩游戏、吃饭、取消约会等。然而,这些看似平常的行为背后,却隐藏着他的疲惫和迷茫。他的生活充满了重复和无聊,即使是看似有趣的游戏和视频,也无法引起他的兴趣。他的四肢无力,仿佛失去了联系,这可能是他内心疲惫和迷茫的象征。他对于时间的感知也是模糊的,他不断地看时间,却似乎无法真正理解时间的流逝。他的生活似乎停滞不前,他的一天似乎永远不会结束。这篇博客引发了我们对于生活的思考:我们是如何度过每一天的?我们的生活是否也充满了重复和无聊?我们是否也像他一样,感到疲惫和迷茫?我们又应该如何打破这种状态,找到生活的意义和乐趣?--GPT 4


任何障碍都能够摧毁我

这篇博客深入探讨了人类生存的意义和动力,以及科技进步如何影响人类的生活。文章首先指出,随着物质社会的丰富,仅仅生存已不能作为人类的主要动力。教育、物质的丰富以及生物本能的提升,使得人类有了更多的思考自身的时间和空间。人类似乎已经迈出了一个小小的步伐,从为了生存而活转变为追求更高的目标。 然而,这个问题没有明确的答案。文章提出,如果是在50年前,生存可能仍然是人们的主要动力。但在科技日新月异的今天,这个动力似乎已经被科技和物质的追求所取代。人类在科技上的进步超越了人类本身生物上的进步,这让人类的生活方式发生了根本的变化。 文章最后提出一个有趣的问题:如果人类能够依靠科技而活,那么如果不能够依靠科技,是否就失去了活的欲望?这个问题引发了对人类本质和未来的深度思考。人类是追求进步的,还是追求不进步的?我们是应该追求科技、物质的欲望,还是应该坚守生物的本能的欲望? 这篇博客提出了许多值得思考的问题,希望读者能够通过阅读全文,找到自己的答案。--GPT 4

fiction

上班是在浪费生命

这篇博客以一种深思熟虑的方式探讨了人的价值、劳动的价值以及这些价值如何在雇佣关系中被剥夺和转化。文章指出,当人的价值被否定,人的劳动价值被剥夺,人便否定了自己。在这个过程中,人和价值的关系被淡化,尽管人仍能创造价值,但不再拥有价值。 文章进一步阐述了雇佣关系中的价值转移。雇员以雇佣形式为公司创造价值,实际上是在出卖自己的价值。这里出卖的不是价值实体,而是人创造价值本身的能力。在这个过程中,人的价值不再属于自己,人虽然仍然是人,但却不再是一个有价值的人。 文章还指出,剥夺价值的实体——公司,给予雇员的劳动等价物,实际上不等价,也永远不可能等价。这种补偿不能恢复人创造价值的能力。因此,剥夺价值的主体和出卖价值的主体之间存在着永远无法调和的矛盾,这是对立的基本矛盾。 文章最后以一种引人深思的方式得出结论:上班是在浪费生命。这种结论可能引发一系列的问题和思考:如果上班是在浪费生命,那么我们应该如何理解工作和生活的关系?我们如何看待人的价值和劳动的价值在雇佣关系中的转化?我们又如何理解和处理剥夺价值和出卖价值之间的基本矛盾?这些问题值得我们每一个人去思考和探索。--GPT 4

shit works

在 Rust 中使用 Actor 模型

在本篇博客中,我们探讨了在Rust编程语言中如何使用Actor模型来解决多线程共享变量的线程安全问题。文章首先介绍了Rust中使用`Mutex`锁来实现线程安全的基本方法,然后通过实际案例展示了在多线程通讯功能中,使用`Mutex`锁可能导致的问题,例如长时间阻塞等。为了解决这个问题,文章尝试了使用`TcpStream`引用来绕过生命周期检查的方法,但这种方法存在一定的不安全性。 然后,文章引入了Actor模型作为解决方案。Actor模型是一种并发计算模型,由许多独立的并发实体组成,每个实体都是一个Actor。每个Actor都有自己的状态和行为,Actor之间通过消息传递。在这个模型中,每个客户端都成为一个Actor,分别持有自己的`TcpStream`,无论是向这个`TcpStream`发送还是监听,都由持有这个`TcpStream`的Actor去执行,而执行的时机就通过消息(Message)来触发。这种方法避免了全局变量和原始指针的使用,同时也没有`Mutex`锁,看起来更加干净清爽。 那么,Actor模型是否能完全解决多线程下的线程安全问题呢?如何在实际中更有效地使用Actor模型?这些都是值得我们进一步探讨的问题。--GPT 4

Rust