Flutter 的状态管理

REDUX Redux 诞生于前端社区，它的目的是用来解决复杂前端应用的状态问题。但是它的设计理念并不局限于前端，它甚至可以用在 Android ，以及 iOS 开发上。redux.dart 是基于 dart 语言的 redux 实现，配合 dart 生态，你可以在 Web ，或者 flutter 上使用它。/image/92f8ed70-1dc9-4e65-9298-590412562698/a1a3b3e8-1cf5-47aa-9cd3-ec193b3cbda3_Untitled_Diagram.png [data:image/jpeg;base64,/9j/2wBDABALDA4MChA ... read more

页面的加载性能优化方案

为什么要进行性能优化？ 在回答这个问题之前，先问问你自己，你会等待一个页面加载超过10秒吗？或者你会使用一个点击某个按钮需要几秒之后才会有响应的页面吗？我想大部分人应该不会。很明显人的耐心是有限的，如果页面的加载时间，页面的响应时间超出了他的耐心，那么他很大可能会选择离开这个页面。这就是为什么要进行性能优化的原因了。性能优化就是让用户尽可能快地打开页面，尽可能流畅地使用页面。Google Developers 上的一篇文章：性能为何至关重要 [https://developers.google.com/web/fundamentals/performance/why-performance-m ... read more

React Router 的跳转中断与自定义 UI

起因 在我最近几年的开发经验里面，我所负责的业务基本上都是移动端的页面。这几年来，有一个越来越明显的感受是，现在的产品经理越来越希望移动端的 HTML 页面能做到跟 Native 应用相似的用户体验。举个例子，产品经理会希望前端页面能够直接唤起手机里面的某个应用，比如点击页面的“发送给 WhatsApp 好友”，就唤起 WhatsApp 应用，并且进入选择分享对象的界面，而且还要能自动带上分享的内容。当然这种场景现在确实是可以做到的，比如可以使用 WhatsApp 的私有协议 whatsapp://send 来实现，或者在安卓手机下，还可以使用更加规范的 intent 协议 [https:// ... read more

Flexbox

什么是 FLEXBOX ? Flexbox 是指 CSS 中将元素的display规则设置为flex或者inline-flex时所展示出来的布局模式。主要为了解决什么问题？ 1. 高效灵活地布局，对齐。在 Flexbox 尚未出现之前，页面的布局通常都是用浮动或者绝对定位和相对定位来实现。布局方式不多，但是也勉强可用。但是到后来，随着前端技术的快速发展以及页面布局需求的快速迭代，传统的布局方式在越来越酷炫和高大上的设计稿前面，就显得表现力不足以及布局变得麻烦而且不够灵活。特别是对于元素的对齐，往往得花费一定的精力使用各种技巧才能实现。Flexbox 这一布局方式的出现则可以看做是为了解决布局 ... read more

巴掌大的迷你主机云轩 H170 使用体验以及 Homelab 搭建

在 19 年年底的时候，逛 SMZDM 的时候无意间看到云轩 H170 的相关文章，一下子就中毒了。云轩 H170 是一台 mini-STX 的准系统主机，它的特点是体积非常迷你，而且价钱非常便宜。主板+机箱+电源的准系统套餐只需要369（我购买的时候有优惠，原价 499 ，目前优惠价在 379 左右）。 纠结了一两天之后，便下单了。 购买理由以及使用场景购买这台主机的理由主要是想买来跑一些对 CPU 有一定要求的服务 ... read more

使用 PVE 运行 Clash 旁路由虚拟机实现透明代理

在没折腾旁路由之前，家里的翻墙都是在路由器上安装 SS 服务，在路由层面实现代理，这样联网的设备都可以享受到透明代理的好处，即不需要安装任何软件就能愉快地访问境外网站。但是这个方案有个致命的缺点就是，路由器的性能太差，远远不能跑满带宽的速度。 以我手头的设备来说，路由器是华硕的 AC86U ，讲道理这个路由器性能是不差的，两年前花了800+ RMB 买的，但是运行 SS 的话，速度连 100 Mbps 都跑不到，而目前家里的宽带下行 500 Mbps 上行 50 Mbps ... read more

神奇的 <link> 标签

按照标准的定义，&lt;link&gt; 标签其实是用来表明当前页面与外部资源的关系： The HTML External Resource Link element (&lt;link&gt;) specifies relationships between the current document and an external resource. —— MDN一个最简单的例子，便是我们最熟悉的样式文件引用了 ... read more