编程语言
基于 SVG 的图形交互方案实践
数字大屏趋势中人们追求花里胡哨的外观，虽有多元素、多种类、多媒介，却仍未脱离中国式报表宿命。随着数字大屏发展到物联网和工业互联网领域，对数字大屏交互的需求不断增加，提到了使用HTML5图片热区特性和SVG实现交互的思路。通过示例展示了基于SVG的交互逻辑，比较了SVG和HTML5热区的优劣，认为SVG更友好且较为理想，但在实际应用中还需克服非技术挑战，如设计师适应矢量图格式等问题。文章指出处理拖拽、缩放、旋转等操作时会面临挑战。
前端开发
聊一聊前端图片懒加载背后的故事
博主通过采取一系列优化措施，成功将博客的首屏渲染时间从2.0 秒缩短到了 1.7秒。这些措施包括使用 CDN 加速、压缩图片、生成缩略图和采用懒加载技术。文章主要介绍了前端图片懒加载技术，解释了其概念、目的和实现方式。懒加载是一种通过延迟加载来优化网页性能的方法，尤其适用于图片较多的网页。文中介绍了三种实现懒加载的策略：监听滚动事件、使用 IntersectionObserver API 和利用浏览器原生的 `loading='lazy'` 属性。通过比较这三种方法的优缺点，作者推荐结合使用前两种方法以更精确地控制懒加载的细节。文章最后强调了懒加载在前端性能优化中的重要性，并提供了示例代码供读者参考。
前端开发
支持外部链接跳转的 Vue Router 扩展实现
Vue Router 是 Vue 中重要的插件，特别在单页面应用中起着关键作用。随着页面概念逐渐消失，路由根据URL确定显示内容。文章介绍了处理内部和外部链接的问题，提出了在 Vue Router 基础上实现外部链接跳转的扩展思路。通过自定义组件 MyRouterLink，区分内部和外部链接并支持传递URL参数，解决了 Vue Router 不支持外部链接的问题。讨论了如何给出站链接携带令牌信息，通过指令或组件内部处理统一附加参数。最终强调了在项目中统一使用规范化组件的重要性。
前端开发
在 Vue.js 中使用 Mock.js 实现接口模拟
最近参与前端项目的作者反思了程序员少有机会写自己喜欢的代码，更多时候是为别人写代码。在谈到 Vue.js 结合 Mock.js 实现接口模拟这一话题时，指出它触及前后端分离的核心，并引出协同开发中的问题。讨论了前后端团队接口文档制定和假数据管理的挑战，以及 Mock.js 在解决这些问题上的作用。提到 Swagger 作为接口文档管理工具，推荐使用 Mock.js 来模拟前端调用后端接口，强调了在 Vue 中如何使用 Mock.js 实现接口模拟，以及如何通过 YAPI 或 Apifox 等工具管理 API 接口和 Mock。最后，勉励读者在项目中努力前行，引用古语“山不厌高，海不厌深”表达对追求更完美世界的理想。
编程语言
ASP.NET Core gRPC 打通前端世界的尝试
在构建以 gRPC 为核心的微服务架构过程中，涉及到了 gRPC 的过滤器、健康检查、重试等内容。随着现代前端框架如React、Angular和Vue的兴起，以及前后端分离的趋势，将 gRPC 与前端打通成为一个复杂问题。文章介绍了四种打通 gRPC 和前端的方式：gRPC-Web、gRPC-Gateway、封装 Web API和编写中间件。其中，gRPC-Web提供了通过命令行工具生成强类型客户端代码的方案，而gRPC-Gateway则是将RESTful JSON API转换为gRPC服务的方案。另外，封装 Web API和编写中间件也是解决这一问题的方案。文章最后强调了通过编写中间件的方式，将 gRPC 服务转化为 Web API 的思路，并提供了相关的代码示例。
编程语言
ABP vNext 对接 Ant Design Vue 实现分页查询
本文主要讨论了在使用 ABP vNext 和 Ant Design Vue 实现分页查询时的问题。通过介绍 ABP vNext 中的分页查询实现方式以及 Ant Design Vue 中的 STable 组件的参数要求，作者展示了如何在前后端技术栈间进行上下文切换，并提供了参数转换层的代码示例来实现两者之间的无缝集成。最终，作者展示了如何封装前端服务层以及实现 loadData 方法，实现了 ABP vNext 与 Ant Design Vue 的完美整合，提高了开发效率。整体内容涵盖了技术实现细节和开发经验分享。
前端开发
zTree 删除/拖拽子节点保留父节点分组样式
最近项目需要实现报表的自定义设置功能，选择了zTree插件来创建一个功能强大且美观的树形菜单。使用zTree的API简单，通过提供一个DOM节点和JSON数据就能渲染出树形菜单。作者介绍了如何结合节点的编辑、拖拽功能。发现了两个Bug并提供了解决方法。最后讨论了如何存储和获取树形结构的数据，通过递归遍历节点获取关键信息。作者强调前端开发集成到系统中的挑战。
前端开发
分享两种实现前端拖拽排序的方案
在这篇文章中，作者分享了在前端中实现拖拽排序的三种方案：Nestable、Sortable和HTML5原生方案。Nestable是基于jQuery的插件，虽支持分层列表但已不再维护，不建议在正式项目中使用；Sortable支持多框架，文档完善且易用，是更优的选择；HTML5原生方案利用拖放API实现，虽存在兼容性问题但在现今浏览器环境下可行。总结建议根据实际需求选择合适的方案。
生活感悟
从 React 专利事件看开源软件许可
Payne在其博客中讨论了React专利事件引发的开源软件许可和商业化之间的平衡问题。他回顾了React专利事件的发展历程，指出了主流开源软件许可证（如GPL、BSD、MIT、MPL、Apache和LGPL）的特点。他认为React专利事件受到关注的原因在于专利许可的不对等性和对开源社区的负面影响。最终，Facebook宣布将React的开源协议修改为MIT，引发了社区的一次胜利。Payne鼓励人们在选择开源软件许可证时找到商业化和开源之间的平衡点，并强调了技术的不断变化和努力打好基础的重要性。1
