createMemo¶

Мемо позволяют эффективно использовать производное значение во многих реактивных вычислениях. createMemo создает реактивное значение readonly, равное возвращаемому значению заданной функции, и следит за тем, чтобы эта функция выполнялась только при изменении ее зависимостей.

1
2
3
4
5
6
7

function createMemo<T>(
    fn: (v: T) => T,
    value?: T,
    options?: {
        equals?: false | ((prev: T, next: T) => boolean);
    }
): () => T;

Вот пример использования createMemo:

1
2
3
4
5
6

const value = createMemo(() =>
    computeExpensiveValue(a(), b())
);

//read the value
value();

В Solid часто нет необходимости оборачивать функции в памятки; в качестве альтернативы можно просто определить и вызвать обычную функцию, чтобы получить аналогичное реактивное поведение. Основное различие заключается в том, что функция вызывается в нескольких реактивных настройках. В этом случае при обновлении зависимостей функция будет вызываться несколько раз, если она не обернута в createMemo. Например:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

const user = createMemo(() => searchForUser(username()));
// compare with: const user = () => searchForUser(username());
return (
    <ul>
        <li>Your name is `${user()?.name}`</li>
        <li>
            Your email is <code>{user()?.email}</code>
        </li>
    </ul>
);

Когда сигнал имени пользователя обновляется, searchForUser будет вызван только один раз. Если возвращаемый пользователь действительно изменился, то обновляется памятка пользователя, и тогда оба элемента списка обновляются автоматически.

Если бы вместо этого мы определили user как простую функцию () => searchForUser(username()), то searchForUser вызывался бы дважды, по одному разу при обновлении каждого элемента списка.

Еще одно ключевое отличие заключается в том, что мемо может защитить зависимые элементы от обновления, когда изменяются зависимости мемо, но не изменяется результирующее значение мемо. Как и createSignal, производный сигнал, созданный createMemo, обновляется (и вызывает повторное выполнение зависимостей) только тогда, когда значение, возвращаемое функцией memo, действительно меняется по сравнению с предыдущим значением, в соответствии с оператором JavaScript ===. В качестве альтернативы можно передать объект options с equals, установленным в false, чтобы всегда обновлять memo при изменении зависимостей, или передать собственную функцию equals для проверки равенства.

Функция memo вызывается с аргументом, равным значению, возвращенному при предыдущем выполнении функции memo, или, при первом вызове, равным необязательному второму аргументу функции createMemo. Это удобно для сокращения вычислений, таких как:

1
2

// track the sum of all values taken on by input() as it updates
const sum = createMemo((prev) => input() + prev, 0);

Функция memo не должна изменять другие сигналы путем вызова сеттеров (она должна быть "чистой"). Это позволяет Solid оптимизировать порядок выполнения обновлений мемов в соответствии с их графом зависимостей, так что все мемы могут обновляться не более одного раза в ответ на изменение зависимости.

Параметры и аргументы¶

Ссылки¶

• createMemo

Комментарии