https://zhelin.me/小程的研发日常，分享 iOS、前端、Linux、RouterOS、Docker 等技术干货，以及开发经验、工具推荐与实用教程，帮助开发者高效学习与应用。zh-CNThu, 11 Sep 2025 23:08:11 +0800https://zhelin.me/post/8f412a886b1dffcb/Thu, 11 Sep 2025 23:08:11 +0800https://zhelin.me/post/8f412a886b1dffcb/<p>在前端开发里，“DOM 截图 → 图片/文件导出” 是一个高频需求场景。无论是营销海报、报表导出、还是社交分享卡片，截图工具的体验直接决定了用户感受。</p>https://zhelin.me/post/2ad0bda53a4d7fdd/Mon, 01 Sep 2025 19:08:18 +0800https://zhelin.me/post/2ad0bda53a4d7fdd/<p>很多iOS用户在使用应用时会遇到这样的情况：新版应用更新后，反而失去了某些实用功能，或者在旧设备上运行卡顿，还有就是线上出现了BUG，需要回滚老版本验证。这时候，下载<strong>旧版本 App</strong>就显得尤为重要。本文将手把手教你在<strong>Mac电脑</strong>上下载 iOS 应用的旧版本，并最终导入到设备中。</p>https://zhelin.me/post/255eab43d3457e40/Sun, 31 Aug 2025 12:25:00 +0800https://zhelin.me/post/255eab43d3457e40/<p>在前端开发或者写作时，<strong>占位图（Placeholder Image）</strong> 是必不可少的工具。它们能帮助我们快速测试布局、响应式设计和图片比例。很多人可能用过 <a href="https://picsum.photos/">Lorem Picsum</a> ，但这些工具大多提供的是风景图或者纯色方块，看久了难免单调。</p>https://zhelin.me/post/281bb7afdc9b8a8f/Thu, 02 Nov 2023 15:09:11 +0800https://zhelin.me/post/281bb7afdc9b8a8f/<p>在当今数字化时代，网络安全已经成为组织和个人日常生活中的一个至关重要的方面。随着互联网的普及，网络威胁和攻击的复杂性和频率也在不断增加。在这个背景下，强大的防火墙技术变得尤为关键，以保护我们的网络和数据免受未经授权的访问、恶意攻击和信息泄漏的威胁。</p>https://zhelin.me/post/e4aba903f3826e7b/Sat, 28 Oct 2023 10:44:37 +0800https://zhelin.me/post/e4aba903f3826e7b/<p>通过充分利用RouterOS的强大功能，我们可以探索自定义路由的各种协议，如BGP和OSPF，但这些方法可能在上手时有一些难度。在家庭网络中，使用这些协议会增加维护成本。很长一段时间以来，我一直依赖旁路网关和DHCP模式来满足上网需求。然而，我常常在思考是否有更简单且影响范围更小的上网方式。</p>https://zhelin.me/post/7f5bdbb2857e15aa/Fri, 29 Sep 2023 15:51:48 +0800https://zhelin.me/post/7f5bdbb2857e15aa/<p>在我将家里的主路由改为RouterOS后，始终找不到一个能完美更新内网设备IPv6的脚本，要么是通过EUI64转换的，要么就是端口转发，还有引入第三个设备，用别的语言去做DDNS的更新，这些方案虽然都能实现最终的效果，但无疑是增加了别的成本，而且不够优雅。RouterOS本身就支持的东西，为什么要舍近求远并？这并不是我的风格。</p>https://zhelin.me/post/55a64d40ffbb030d/Wed, 13 Sep 2023 00:00:33 +0800https://zhelin.me/post/55a64d40ffbb030d/<p>使用Portainer忘记密码快速解决方案：</p> <p>1、进入服务器后台</p> <p>2、下载镜像：<code>portainer/helper-reset-password</code></p> <div class="highlight"><div style="color:#c6d0f5;background-color:#303446;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"> <table style="border-spacing:0;padding:0;margin:0;border:0;"><tr><td style="vertical-align:top;padding:0;margin:0;border:0;"> <pre tabindex="0" style="color:#c6d0f5;background-color:#303446;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"><code><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#838ba7">1 </span></code></pre></td> <td style="vertical-align:top;padding:0;margin:0;border:0;;width:100%"> <pre tabindex="0" style="color:#c6d0f5;background-color:#303446;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"><code class="language-shell" data-lang="shell"><span style="display:flex;"><span>sudo docker pull portainer/helper-reset-password </span></span></code></pre></td></tr></table> </div> </div>https://zhelin.me/post/a833d3d09b637363/Sat, 07 May 2022 22:03:52 +0800https://zhelin.me/post/a833d3d09b637363/<p>在阅读《敏捷革命》之前，我一直不太能够全面的理解敏捷开发。也是通过阅读本书，了解了相关的知识。那么在这里，我会通过对本书的梳理，将我所了解到的知识点写下来。</p>https://zhelin.me/post/83e19b1a7821ce77/Fri, 07 Jun 2019 15:10:43 +0800https://zhelin.me/post/83e19b1a7821ce77/<p>敏感词过滤应该是许多后端同事经常会遇到的需求，无论是评论、弹幕、文章，都需要做敏感词过滤处理来规避风险。在前端开发中，使用replace函数来替换字符串是我们的常规操作。在这之前我思考过如果用JavaScript来实现敏感词过滤该怎么做。在学习过程中，接触到了Trie树，瞬间有一种拨开云雾见青天的感觉。</p>https://zhelin.me/post/c0b8cda398ddb4de/Sun, 06 May 2018 14:43:19 +0800https://zhelin.me/post/c0b8cda398ddb4de/<p>前段时间在Ghost博客系统群与群友交流，谈到了Node内存管理的问题，发现很多小伙伴对Node内存管理完全处于一个“零认识”的状态，这可能与本身工作没有接触到相关，毕竟我们大多数工作可能与DOM打交道，当页面内存占用过多（可能性也很低），几乎不用等GC，用户已经刷新或关闭了网页。</p>https://zhelin.me/post/7b09e2961e9a9741/Sun, 22 Apr 2018 13:12:09 +0800https://zhelin.me/post/7b09e2961e9a9741/<p>作用域，这个词在编程界经常能听到看到，每一个程序员几乎都有被问到过。在前端圈，面试JavaScript相关知识，这可以算说是一个非常基础的问题了。但早年间我长期陷入了一种“只可意会不可言传”的地步，我不知道是不是有许多小伙伴与我曾经有一样的经历，所以我就抽时间把书本中看到的东西整理了一下。把提炼的东西分享给大家。</p>https://zhelin.me/post/2be74cd510d0545c/Sat, 18 Feb 2017 10:22:36 +0800https://zhelin.me/post/2be74cd510d0545c/<p>使用3D硬件加速提升动画性能时，最好给元素增加一个z-index属性，人为干扰复合层的排序，可以有效减少chrome创建不必要的复合层，提升渲染性能，移动端优化效果尤为明显。</p>https://zhelin.me/post/5356825055f9b3a1/Thu, 22 Dec 2016 13:16:19 +0800https://zhelin.me/post/5356825055f9b3a1/<h2 id="发布订阅模式">发布订阅模式</h2> <p>因前段时间业务需要使用到了观察者（Observer）模式，同时在使用的过程中，让我想起了Publish/Subscribe（发布/订阅）模式。起初感觉这两种模式非常相似，但是细细观察你会发现，Observer模式要求希望接收到主题通知的观察者（或对象）必须订阅内容改变事件。</p>https://zhelin.me/post/3513d4c34d05f768/Mon, 31 Oct 2016 07:58:19 +0800https://zhelin.me/post/3513d4c34d05f768/<p>在上一篇《<a href="https://zhelin.me/post/16a0ba1f57202a18/">从画一个圆开始——CSS圆角探秘（一）</a>》中，我们重新了解border-radius的一些属性。我们画好了正圆，了解了圆角，难道border-radius的功能仅限于此吗？</p> <p>我想并不是，就如同在上一篇文章中border-radius完美结合box-shodow形成多重圆角边框一样。也许还有其他属性与它结合，会产生不一样的效果与功能。</p>https://zhelin.me/post/16a0ba1f57202a18/Wed, 14 Sep 2016 23:35:07 +0800https://zhelin.me/post/16a0ba1f57202a18/<p>这篇文章能够成型因为两个原因。一是团队内部的分享会，二是CSS魔法在2015年CSS Conf上的一次分享。也因为魔法哥的这次分享，深深的勾起了我对CSS深入了解的欲望。也促成了这篇文章的成型。</p>