JordanMarr

module DragDropPage

open Feliz
open Fable.React
open Fable.React.Props
open ReactDND

type Language = {
    Name: string
}

zanaptak

React.memo, React.useCallback, React.useMemo

Normally, function components are rerendered every time the application renders. If you have large/complex components, this can affect application performance.

You can use React.memo, React.useCallback, and React.useMemo to memoize parts of your application. This means that React will cache and reuse their previous results instead of rerendering them.

Example:

We start with a useReducer-based Counter application, with the following additions:

darrarski

import SwiftUI

public struct FormattedTextField<Formatter: TextFieldFormatter>: View {
    public init(_ title: String,
                value: Binding<Formatter.Value>,
                formatter: Formatter) {
        self.title = title
        self.value = value
        self.formatter = formatter
    }

darrarski

import SwiftUI

public struct NumberField: View {

    public init(_ title: String,
                value: Binding<NSNumber?>,
                decorator: @escaping (String) -> String = { $0 }) {
        self.title = title
        self.value = value
        let formatter = NumberFormatter()

remarkablemark

# set the base image to Debian
# https://hub.docker.com/_/debian/
FROM debian:latest

# replace shell with bash so we can source files
RUN rm /bin/sh && ln -s /bin/bash /bin/sh

# update the repository sources list
# and install dependencies
RUN apt-get update \