最近打算更新一个新站点 https://next.iceprosurface.com/ 后续如果验证没有问题,就会用那边的更新这边的站点。
有兴趣的阅读者可以前往那边看看~
懒惰的后端程序员,不务正业学习前端中
最近打算更新一个新站点 https://next.iceprosurface.com/ 后续如果验证没有问题,就会用那边的更新这边的站点。
有兴趣的阅读者可以前往那边看看~
godot 4.1.2+
.net 8
一般而言我们的游戏过场通常会有一些过场动画,这个时候通常一般是用来加载数据、场景,随后进入场景。我们可以在 godot4 中用下面这个方式去载入场景:
GD.Load<PackedScene>("res://scenes/LoadingScene.tscn");
这样去编写好处是比较简单的,坏处是我们不知道加载进度,所以我们要更换一个实现方案:
more >>这是一篇 2022年的文章,补档用,里面的某些内容可能已经过时。
我们团队在过去的几个月中一直在进行大仓基本能力建设,经过若干个月的时间和应用以后,在此想分享一下存在坑和理念。
值得注意的是,我 着重声明的一点 就是:单仓的挑战是 极其巨大的,在整个团队还没有做好 转型
和 预先的准备
情况下,贸然的切换成单仓,除了使得整个开发流程变得更混乱以外,没有任何好处。
对于我们而言:单仓 + 主干开发 从来不是一个 孤立 的 工程实践,而更应该被视为一个 工程实践的放大器。简单的说就是这一套流程将在会放大其流程、工具的收益的同时,还会 等效的 放大错误 和异常。任何项目中的错误实践都有可能以指数递增的方式给整个项目带来极大的麻烦。
而单仓的实现通常没有完全一样的落地实践,对于不同的企业公司文化而言,会有截然不同的实践落地方式,故而单仓的实践只能更多的是基于方法论的指导思想,而非实际的落地方案,因为对于不同文化背景、环境、基础设施的情况下,往往实践落地的方案是大相径庭的。
more >>godot 4.1.2+
.net8
一般来说需要使用 单例 获取的通常都是 autoloads 的代码,由于 MainLoop 实质上也是单例的,所以可以通过 mainLoop 来获得 sceneTree 通过 root GetNode 来获取
public partial class Test : Node
{
public static Test Instance
{
get
{
var mainLoop = Engine.GetMainLoop();
if (mainLoop is SceneTree sceneTree) return sceneTree.Root.GetNode<Test>("/root/<name>");
return null;
}
}
}
这样我们就能比较简单的获取这个实例了 Test.Instance.xxxx
不过这种代码在 autoloads 中使用并不如直接 __Ready
来的方便,所以这里并不推荐,这一方法比较适合的是在 Node 外部调用时,通过全局 API 访问才需要。
还有一种比较常见的方式是通过 public static 在 ready 的时候去注册:
public partial class Test : Node
{
public static Test Instance { get; private set; }
public override void _Ready()
{
Instance = this;
}
}
react dnd backend html5 是 react-dnd 的一个工具包,其目的是为了封装并统一化处理一些拖拽的事件,配合 DnD Provider 就可以方便的基于下面几个常用的 backend 实现不同端的快速适配:
在 react-dnd 种通过 provider 的 dnd backend 可以方便的转换 dom 事件为 react 中的数据流。
常见的 react 拖拽库基本都基于 react 的 dnd 库做的适配,譬如富文本编辑器等等,一般而言如果你使用的是同一框架,理论上只需要复用同一个 backend 就可以方便的在不同的 react component 上使用。
但是我们碰到的情况有所不同。
目前使用 react dnd 的地方是一个富文本编辑器,基于 slate 封装的。但是我们的主体应用是 vue (vue2),而在 vue 中使用拖拽事件是基于原生编写的。这就带来了一个问题,react dnd 利用 backend 强制捕获了所有的事件,并通过 event.preventDefault 阻止了默认事件,换而言之,这种情况下 vue 显然是不能正常工作的。
对此只能尝试翻一下 github issue 来看看有无前人的解决方案:
万幸的是在过去已经有人碰到了类似的问题:https://github.com/react-dnd/react-dnd-html5-backend/issues/7
上面的方案已经过去很久所以目前是有缺少一些 handle 的,所以基于这个方法简单的封装一下即可:
import { HTML5Backend } from 'react-dnd-html5-backend';
type BackendFactory = typeof HTML5Backend;
const ModifiedBackend: BackendFactory = (...args) => {
// 可以选择修改一下传入的 args 也可以选择直接写死在这里让 dnd 的作用范围缩小到你期望的地方
const shouldTargetEffect = (domNode: HTMLElement) => domNode.closest('.xxx-class-name');
// 这里的类型都得设置为 any 因为内部的 handle 方法都没暴露无法准确的做类型提示
const instance: any = HTML5Backend(...args);
const listeners = [
'handleSelectStart',
'handleTopDragStart',
'handleTopDragStartCapture',
'handleTopDragEndCapture',
'handleTopDragEnter',
'handleTopDragEnterCapture',
'handleTopDragLeaveCapture',
'handleTopDragOver',
'handleTopDragOverCapture',
'handleTopDrop',
'handleTopDropCapture',
];
listeners.forEach((name) => {
const original = instance[name];
instance[name] = (e: any, ...extraArgs: any) => {
if (shouldTargetEffect(e.target)) {
original(e, ...extraArgs);
}
};
});
return instance;
};
最近某 @黄同学 发现有这么一个奇怪的情况,使用 watch 监听数组的对象时,会 奇怪的多触发一遍。
本着找找原因的想法,于是他整出一个最小 demo 差不多类似于下面这样:
const combObj = ref({ a: 1, b: 2 });
const a = computed(() => obj.value.a);
watch([ref(), a], () => console.log('a'));
watch([shallowRef({}), a], () => console.log('b'));
watch([reactive({}), a], () => console.log('c'));
watch([a], () => console.log('d'));
watch(a, () => console.log('e'))
combObj.value = { ...combObj.value, b: 3 }
对于上面这个例子大家可以先用自己的 vue 知识推理一下, 正确的结果是什么?
相信大家很快就会得出下面这个结论:
watch [ref, computed]
这个行为很好理解,ref 当作常量,computed 因为前后没改,所以 直接不触发watch [shallowRef, computed]
由于 shallowRef 的特殊性,修改后我们不认为是只有对象本身被修改,所以应该 会触发。watch [reactive, computed]
由于 reactive 的特殊性,不论多么深层的修改,我们都应该把整个对象的变化视作不同对象,所以 应该触发。watch([computed])
啥都没改,不触发watch(computed)
啥都没改,不触发诶执行一下,怎么第一个触发了!
more >>最近发现我们的项目构建速度越来越缓慢的,不得已,还是得稍微解决一下构建问题的。
首先我们的项目本身对浏览器兼容性要求不高,所以构建是可以省略很多内容的,首先推了一下另外一个小伙伴把错误的 .browserslistrc
改了一下。
一个常见的错误就是声明 last 2 version:
> 1%
last 2 versions
事实上你认为 last 2 version 是指浏览器最新的 2 个版本,这个 2 个版本是包含所有浏览器的。换而言之 ie 的两个版本(IE10 & IE11)都会被囊括的。
所以你需要新增两个“补充条款” ———
not dead
not ie 11
这样就把已经上路的浏览器和还算没上路 IE11 送走了。
下面就是调整一下构建。
more >>在过去的几年里面,我陆陆续续的更换了很多次编辑器,其实最早我用的一直是印象笔记。通过印象笔记我积攒了很多的笔记和知识记录。但是随着国内印象笔记的逐渐发展,他变得越来越不好用了,甚至出现了广告,虽然是他们自己家的,但是这种行为让我越发的感受到不舒服。
受迫于早些年我买了10年的会员,这个时候就暂且忍住了,直到前几年他推出了越来越过分的会员制度和策略,一遍又一遍的刷新了下限(和百度网盘那样)。
于是忍无可忍的我终于决定彻底从他那边出走,寻找一个更好的知识管理软件,如果是 markdown 的那就更好了。
在一段时间的搜索后,终于发现了一个更好玩的东西 —— obsidian。
more >>10月10号瞅见 volar 更新了,今天早上过来就把 volar 升级了,从官网上来说,volar 实现了一个与 vue 框架无关的外置 ts server 用来给 vue 以外的语言实现语言服务器,比如 svelte。
当然这不是我比较关心的内容,从 release 的信息看主要提升在于性能,目前实际测试下来速度提升还是非常明显的。
之前 vue 文件的提示大约需要 100-500 毫秒的事件才能显示,现在 打开文件,输入以后几乎没有延迟就可以获得补全提示了。
此外就是项目的 vue-tsc 检测速度也大幅度提升(虽然我看 vue-tsc 代码也没改动),原先检测整个项目需要花费约 22秒的时间,现在在6秒内就可以出结果了。
当然现在 volar 对于项目内的 vue-tsc 版本也会进行检查,如果出现下图的内容,直接升级一下 vue-tsc 即可。
之前我介绍了一下 lunar-vim,lunar-vim 诚然是一个不错的选择,但是实际上在 vscode 中直接开启 vim 已经能有不错的体验的了,这里只需要稍稍做一下配置的修改即可。
more >>此处空空如也~
输入点什么来搜索吧!