小编Guy*_*uff的帖子

使画布填充包括形状中的笔划

好吧,我正在用纯 JavaScript 制作一个 3D 渲染引擎,这当然是一个挑战 - 测试我的线性代数技能。我没有使用 webgl,所以请不要说“使用 webgl”。

无论如何,该软件将接收三角形、相机和局部变换,并将数据渲染到屏幕上(我什至使其具有交互性)

然而渲染代码只有 6 行,分别是:

// some shading and math calculations then this:
context.fillStyle = color;
context.strokeStyle = color;
context.beginPath();
context.moveTo(x0, y0);
context.lineTo(x1, y1);
context.lineTo(x2, y2);
context.lineTo(x0, y0);
context.closePath();
context.fill();
context.stroke();
Run Code Online (Sandbox Code Playgroud)

虽然这有效,但在我的 Chromebook 上,当 4k+ 面孔出现时,速度会下降到 10fps。(普通计算机上为 60fps)

无论如何,输出是这样的:

*龙3D渲染*

但为了使其更快,并且由于画布状态变化很慢,我删除了笔画,使渲染代码如下:

// some shading and math calculations then this:
context.fillStyle = color;
//context.strokeStyle = color;
context.beginPath();
context.moveTo(x0, y0);
context.lineTo(x1, y1);
context.lineTo(x2, y2);
context.lineTo(x0, y0);
context.closePath();
context.fill();
//context.stroke();
Run Code Online (Sandbox Code Playgroud)

它的运行速度是原来的两倍,但是渲染到屏幕上的结果是这样的:(不同的模型) …

html javascript canvas fill stroke

6
推荐指数
1
解决办法
3161
查看次数

WebGL 帧缓冲多重采样

我知道 webgl 可以抗锯齿或多采样你渲染到屏幕上的东西以避免硬边,但是当我使用帧缓冲区时它不再这样做了,并且屏幕上有一堆锯齿状边缘。

如何让帧缓冲区使用多重采样?

javascript multisampling webgl

6
推荐指数
2
解决办法
3855
查看次数

TypeScript - 通用函数的 ReturnType 不起作用

打字稿中有一个名为的功能ReturnType<TFunction>,它允许您推断特定函数的返回类型,如下所示

function arrayOf(item: string): string[] {
  return [item]
}
Run Code Online (Sandbox Code Playgroud)

但是,我在将它与通用函数一起使用时遇到问题:

function arrayOf<T>(item: T): T[] {
  return [item]
}

type R = ReturnType<typeof arrayOf> // R = {}[]
type R = ReturnType<typeof arrayOf<number>> // syntax error
// etc.
Run Code Online (Sandbox Code Playgroud)

使用Typescript ReturnType of generic function的最佳答案,我尝试了这个:(顺便说一句,这不是重复的,它是不同的,因为解决方案和问题确实适用于这种情况)

function arrayOf<T>(x: T): T[] {
  return [x];
}

type GenericReturnType<R, X> = X extends (...args: any[]) => R ? R : never;

type N = GenericReturnType<number, <T>(item: T) => T[]>; // N = never
Run Code Online (Sandbox Code Playgroud)

我还尝试过以下方法: …

javascript types typescript

5
推荐指数
1
解决办法
4129
查看次数

Firebase token.email_verified变得很奇怪

好的,我正在制作一个博客,要求用户通过Firebase登录。要发表评论,必须验证他们的电子邮件

我知道如何验证电子邮件,我使用测试帐户进行了验证。当我输入控制台时

firebase.auth().currentUser.emailVerified
Run Code Online (Sandbox Code Playgroud)

它返回true,所以是的,我的电子邮件已经过验证。

但是注释.validate规则要求对用户进行验证,如下所示:

auth.token.email_verified === true
Run Code Online (Sandbox Code Playgroud)

但是它不起作用,所以我将其删除,然后又开始起作用

经过一番阅读,我意识到我必须

const credentials = firebase.auth.EmailAuthProvider.credential(
  user.email, password);

user.reauthenticateWithCredential(credentials)
  .then(() => { /* ... */ });
Run Code Online (Sandbox Code Playgroud)

这使其完美地工作。原因是Firebase服务器显然花了一些时间来更新其后端验证,但是重新认证立即强制更新。

但是,由于遇到以下问题,我很困惑如何要求用户重新进行身份验证

我怎么知道何时验证用户(firebase.auth().currentUser.emailValidated),同时不更新Firebase后端(auth.token.email_verified === true为false),以便我可以更新自己的UI并提示用户重新进行身份验证

基本上我怎么知道auth.token.email_verified === true客户端何时还没有更新

编辑还存在一个无需重新认证即可更新后端验证的客户端解决方案吗?

编辑我尝试过user.reload().then(() => window.location.replace('/'))但是没用

javascript firebase firebase-security firebase-authentication

4
推荐指数
1
解决办法
540
查看次数

TypeScript - 从对象创建联合

我正在用打字稿创建一个 EventEmitter,但我想不出一种方法来执行以下操作:

假设我有一个这样的界面:

interface EventEmitterSubscription { dispose(): void }

// here it is
interface EventEmitter<T extends { [key: string]: any }> {
  onAnyEvent(callback: (event: { type: ???, payload: ??? }) => void): EventEmitterSubscription
  // ...
}
Run Code Online (Sandbox Code Playgroud)

我找不到一种输入onAnyEvent回调的方法,例如,对于这样的 eventEmitter:

EventEmitter<{ onNumberReceived: number, onCatReceived: { cat: ICat }, onPersonNameReceived: string }>
Run Code Online (Sandbox Code Playgroud)

onAnyEvent字段将具有类型

onAnyEvent(callback: (event: { type: 'onNumberReceived', payload: number } | { type: 'onCatReceived', payload: { cat: ICat } } | { type: 'onPersonNameReceived', payload: string }) => …
Run Code Online (Sandbox Code Playgroud)

javascript types typescript

4
推荐指数
1
解决办法
2058
查看次数