Skip to content

Instantly share code, notes, and snippets.

@artalar
artalar / effector.ts
Created July 8, 2023 16:10
some effector VS reatom
import { $corsProxyEnabled } from '@/src/entities/cors-proxy/model/store'
import { checkInstanceUrl } from '@/src/features/instance/api/check'
import { InstanceCheckResult } from '@/src/features/instance/model/model'
import { BuildConfig } from '@/src/shared/model/build-config'
import {
combine,
createEffect,
createEvent,
createStore,
restore,
@artalar
artalar / bench.ts
Last active April 11, 2023 06:26
json vs custom
export const random = (min = 0, max = Number.MAX_SAFE_INTEGER - 1) =>
Math.floor(Math.random() * (max - min + 1)) + min
const randomObj = (obj: Record<string, any>, deep: number) => {
if (deep <= 0) return obj
const keys = random(5, 10)
for (let i = 0; i < keys; i++) {
const type = random(0, 2)
if (type === 0) {
import { test } from 'uvu'
import * as assert from 'uvu/assert'
import { createTestCtx } from '@reatom/testing'
import { atom } from '@reatom/core'
import { sleep } from '@reatom/utils'
import { reatomAsync, withAbort } from '@reatom/async'
test('safe pooling', async () => {
const createTask = reatomAsync(async () => Math.random())
@artalar
artalar / reatomAsync.tsx
Created March 14, 2023 13:41
Dependent effects cancelation with Reatom
// new API: reatomAsync automatically cancels the previous request
// and all dependent requests when the new request is triggered
const getList = reatomAsync.from(getListApi).pipe(withDataAtom([]));
const getId = reatomAsync.from(getIdApi).pipe(withAbort());
onUpdate(getId.onFulfilled, (ctx, { data: id }) => getList(ctx, id));
const Component = () => {
const [list] = useAtom(getList.dataAtom);
const handleChange = useAction((ctx, e) => getId(ctx, e.currentTarget.value));
// https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
// https://github.com/reactjs/rfcs/pull/220#issuecomment-1259938816
import React from 'react';
// Allow to access a fresh closures in the function but returns stable reference during rerenders
export function useCallbackRef<T extends (...args: unknown[]) => unknown>(callback: T): T {
const ref: React.MutableRefObject<{
stableFn: T;
callback: T;
type LLNode<T = any> = {
prev: null | LLNode<T>
value: T
next: null | LLNode<T>
}
const LLAdd = <T>(prev: LLNode<T>, value: T, next = prev.next) => {
prev.next = { prev, value, next }
if (next !== null) next.prev = prev.next
}
const analyticsAtom = atom((ctx) => {
const { url } = ctx.spy(routeAtom);
const { name } = ctx.get(userAtom);
ctx.schedule(() => logAnalytics("visit_page", url, name));
});
type MyPromise<T> = Promise<Awaited<T>>
async function call<T extends () => any>(fn: T): MyPromise<ReturnType<T>> {
return fn()
}
const res = call(() =>
call(() =>
call(() =>
call(() =>
@artalar
artalar / json-template.jsx
Last active August 6, 2022 00:06
json-template
<>
<h1 id="login">Login</h1>
<form aria-describedby="login" onSubmit={handleSubmit}>
<input type="email" value={email} onChange={handleChangeEmail} />
<input type="password" value={password} onChange={handleChangePassword} />
<button type="submit">Submit</button>
</form>
</>;
// VS
// inspired by https://doc.rust-lang.org/reference/expressions/block-expr.html
function some() {
{
const a = 1;
const b = 1;
var x = 1;
}
{
const a = 2;