immich 厌倦了xx云每月支付？需要避免个人信息流露的风险？ immich提供了强大的本地媒体文件管理功能，以及充满现代感的简洁UI与交互方式 Firecrawl Firecrawl提供了一系列工具用于高效进行网页爬取和数据读取，适用于各种需要从网站获取详细和有组织信息的任务 官方示例: playground Hyprland Hyprland基于Wayland协议，为Linux/类Unix系统用户提供高度可定制的动态窗口管理功能 NocoDB 一个将各种数据库转换为智能电子表格的开源软件，官方称自己是Airtable 的开源替代品 题外话：作为前端很喜欢这种现代简约风格的UI（分页器再扁平一点就好了 screenpipe 想回忆起自己在某个时间段做了哪些工作吗？亦或是想快速总结自己今天在计算机上做了什么？ screenpipe可以全天候收集电脑中的媒体流信息，并借助AI分析用户想要了解的相关信息 官方示例：examples 打工人摸鱼难度++

LocalSend 基于flutter实现，一个非常实用的开源软件，用于局域网内设备的设备互相传输文件（博主本人也经常使用 NB, 这就去学Dart SuperVision 需要在媒体文件中对各种目标检测和分割模型生成的预测数据进行注释？ SuperVision提供了一系列可复用工具来完成这件事情 Kamal Kamal提供了使用Docker在生产环境中部署和管理Web应用所需的一切，旨在简化Docker的部署 官方命令列表： Commands: kamal accessory # Manage accessories (db/redis/search) kamal app # Manage application kamal audit # Show audit log from servers kamal build # Build application image kamal config # Show combined config (including secrets!) kamal deploy # Deploy app to… Continue Reading 【开源简记】第一期

Tailwind介绍 前言 众所周知，CSS是一个相对简单且语法宽松的语言，虽然对开发者友好，但因为它过于“随意”且耦合性强（如height和line-height都会对元素的高度造成影响），如果开发时不做限制，对后续维护的人员来说将会造成“毁灭性打击”。 故为了样式代码的可读性，也为了减少维护人员受到的心理创伤，我们需要对CSS的编写做出限制 BEM命名规范 😀 一般来说，我们编写CSS时类名会遵循BEM命名规范，这种规范的特点是语义化、结构化、遵循开闭原则。参考知乎——CSS之BEM命名规范 “开闭原则”指对修改封闭、对扩展开放，是面向对象思想的重要基本原则 BEM规范存在的问题 😐 语义化的CSS类看似与HTML无关，但在嵌套的CSS选择器（如使用less时）中却反映出了具体的HTML结构。除此以外，CSS里还有很多会被父元素或子元素影响的属性，故将CSS与HTML解耦实际上是很困难甚至无法达成的 在处理两个外表相似的内容时（如下图的作者简介和文章预览），即使样式决策有99%是一致的，我们也很可能需要编写两个语义不同的类来赋予它们样式(如.author-bio和.article-preview)，并且这两个类是几乎不可复用的 实际上，可以通过一些CSS预处理器的如 @extend 等功能实现复用，但会对后续维护造成很大的困扰 即便将类拆分到每个组件，使其不基于内容（如.card .button）虽然可以在一定程度上复用这些类，但当组件功能越具体，复用就会越困难（如.dialog-header__button） 给CSS类命名是令人费神的 原子类 原子类，指具有“原子性”的CSS类 在化学反应中“原子”是最小的单位，故“原子性”指具有不可拆解、不可更改的性质 示例： .flex { display: flex; } 上面的.flex就是一个原子类，它的特点就是一个类名对应一个CSS规则，并且类名应该是和规则有关系的 原子类的思想可以说与我们常用的BEM规范“背道而驰”，BEM强调的是语义化与将CSS从HTML的关注点分离（实际上很可能没有分离），而原子类几乎摒弃了语义化，通过使用提供的大量工具类使页面符合最终的设计决策 Tailwind基本概念 Tailwind就是一个采用了CSS原子类和“All in JS”思想的框架 “All in JS”指“HTML in JS”和“CSS in JS”，其中“HTML in JS”就是Vue、React等框架在做的事 框架特点 Tailwind 提供了一组可重用的 CSS 类，可用于几乎任何类型的 UI 组件和布局。 Tailwind… Continue Reading Tailwind 入门

原题：给定一个大小为 n 的数组 nums ，返回其中的多数元素。多数元素是指在数组中出现次数 大于 ⌊ n/2 ⌋ 的元素。 进阶：尝试设计时间复杂度为 O(n)、空间复杂度为 O(1) 的算法解决此问题。 示例 ： 输入：nums = [2,2,1,1,1,2,2] 输出：2 思路一 首先想到用哈希表记录每个元素出现的次数，然后遍历哈希表，次数最多的值即为答案，比较简单，在此就不放代码了 复杂度：需要遍历一次数组，一次哈希表，且需要哈希表存储最多 n/2 + 1 个元素，故时间复杂度O(n)，空间复杂度O(n) 思路二 上面的思路不满足题目进阶要求中的空间复杂度O(1)，仔细想想自己忽略了一个条件——多数元素出现次数大于 n/2。 要利用这个条件需要一个数学公式，令数组总长度为a，多数元素个数为b，在题目所给条件下有(证明在下方)： \frac{b}{a} > \frac{1}{2}，\frac{b – 1}{a – 2} > \frac{1}{2} 考虑每次从数组中取出两个不同的元素，由于多数元素出现次数大于 n/2，由上面的公式可知，在最坏情况，即每次都取出多数元素的情况下，取出两个不同元素后，数组的多数元素仍然不变 故可将上述思路转换为：将第一个元素设为候选多数元素，遍历数组并计数，若遇到不同元素，则将当前元素的计数减一(相当于取出两个不同元素)，反之加一，元素的计数为0时将候选元素替换为下一个元素，最终剩下的候选元素即为我们需要的结果 代码： var majorityElement = function(nums) { let… Continue Reading 算法题记录——多数元素

原题：给定一个长度为 n 的整数数组 height 。有 n 条垂线，第 i 条线的两个端点是 (i, 0) 和 (i, height[i]) 。找出其中的两条线，使得它们与 x 轴共同构成的容器可以容纳最多的水。返回容器可以储存的最大水量。 示例： 输入：[1,8,6,2,5,4,8,3,7] 输出：49 解释：图中垂直线代表输入数组 [1,8,6,2,5,4,8,3,7]。在此情况下，容器能够容纳水（表示为蓝色部分）的最大值为 49。 思路 看到示例第一时间想到用双指针解决，关键在于何时移动左指针或右指针，并更新结果的最大值 记左指针为lp，右指针rp，记[lp, rp]区间能盛水的值为 y，由短板效应易知 *y = min(height[lp], height[rp]) (rp – lp)** 初始时令lp = 0，rp = n – 1，假设某状态下height[lp] < height[rp]，考虑此时如何移动指针 若将lp右移，则当 height[lp + 1] > height[lp]… Continue Reading 算法题记录——盛最多水的容器

一、JDK版本问题 由于之前开MC服务器时安装过Java1.20.x版本，后面在装Android SDK时就没注意安装相应的JDK版本，导致用yarn android启动时报错 错误信息： BUG! exception in phase ‘semantic analysis’ in source unit ‘BuildScript’ Unsupported class file major version 64 查了一会发现是JAVA版本过高导致的，降级成1.17.8后重新配置环境变量即可 二、Andriod SDK环境变量配置问题 一个低级错误= =，官方文档中已经写了要配置这些变量： %ANDROID_HOME%\platform-tools %ANDROID_HOME%\emulator %ANDROID_HOME%\tools %ANDROID_HOME%\tools\bin 自己配置时漏了一个%ANDROID_HOME%\emulator，导致启动时无法找到安卓模拟器，又报错，加上后解决 三、Andriod Studio下载速度过慢 虽然一开始就知道Android开发需要合理上网，下SDK速度挺快的，但下依赖的速度还是很慢，导致等了两个小时快下载完依赖的时候网络超时，又得重新下，因为不愿意再等两个小时，遂查找解决方法，发现gradle仓库源可以在项目里配置 将/android/build.gradle中的 repositories { google() mavenCentral() } 加上两行替换为阿里云源 repositories { maven{url 'https://maven.aliyun.com/repository/google'} maven{url 'https://maven.aliyun.com/repository/public'} google() mavenCentral() }… Continue Reading 记录搭建React Native环境时遇到的几个坑

原题：实现 copyRandomList 函数，复制一个复杂链表。在复杂链表中，每个节点除了有一个 next 指针指向下一个节点，还有一个 random 指针指向链表中的任意节点或者 null。 初步解决 思路：由于题目中的链表节点有一个随机指针，所以从头节点按顺序复制的话，可能出现指向的随机节点还没有被复制的问题，故考虑先按顺序复制，并将指针都设为null，用哈希表保存每个节点对应的副本，再将节点的指针连起来 代码(js)： const copyRandomList = function(head) { if(!head) { return null } let curr = head const nodeMap = new Map() while(curr) { nodeMap.set(curr, {val:curr.val, next:null, random:null}) curr = curr.next } curr = head while(curr) { nodeMap.get(curr).next = nodeMap.get(curr.next) || null… Continue Reading 算法题记录——复杂链表的复制

问题来源 在实现某具有多级表头格的需求时，发现默认的单元格合并跟UI设计的不同，遂在网上寻找解决方法，于是发现了一个坑 网上的代码： <template> <el-table … :header-cell-style="setStyle" … > … </el-table> </template> <script> export default { … method: { setStyle({row, column, rowIndex, columnIndex}) { if (rowIndex === 0 && columnIndex === 0) { column.rowSpan = 2 } } } … } </script> 此时设置的rowSpan是不生效的 解决思路 因为网上搜到的代码基本都是这么写，故去看了下el-table的源码 table-header.js的render函数中相关源码如下 <th /* 此处设置了colSpan, rowSpan… Continue Reading 解决方案——el-table用header-cell-style回调设置rowSpan不生效

问题来源 由于查询条件改变频率高，或者后端数据处理逻辑复杂，导致接口返回的顺序跟实际请求的顺序不一致。 如：同一接口，先用复杂度高的查询条件发A请求，然后在A还没返回时发简单的B请求，且B返回数据后A才返回，此时若是用 *.then(res => …) 来处理的话，会出现最终使用的是A的返回数据的情况。 解决思路 由于涉及的场景不算复杂，故不打算使用类，个人选择了工厂函数的模式，考虑用两个变量分别保存当前已发送的请求数量，及当前请求的索引，分别记为A，B A初始为0，每次请求时加一，并将A赋值给该请求的索引B，请求返回时对比A和B，则： 若 A > B，说明不是我们期望的请求，在返回的数据中作标记，并在请求返回的回调函数中进一步处理 若 A = B，说明是我们应该处理的请求，将A置为0并返回原数据即可 正确的实现不应该出现 A < B 的情况 代码 /** 例如: * const fetchOptions = limitRequest() * fetchOptions({ url: 'http://www.baidu.com' }).then(res => { console.log(res) }) **/ const limitRequest = function() { const num = new… Continue Reading 解决方案——多次发送同一请求，仅响应最后一次

引入某文件夹下的所有vue组件 const requireComps = require.context('文件夹路径', true, /\.vue$/); const comps = {} requireComps.keys().forEach(name => { const comp = requireComps(name).default // 要求vue组件的$option有name属性 comps[comp.name] = comp // 注意此处comps和comp差别 }) export default { … components: { …comps } … }