ShouldChildrenUpdate.ts

import { Component } from 'preact';

export interface Props {
    cond: boolean | ((prevProps: any) => boolean);
    [K: string]: any;
}

export default class ShouldChildrenUpdate extends Component<Props, void> {
    prevProps: any = this.props;
    shouldComponentUpdate(nextProps: Props) {
        const { cond, ...rest } = nextProps;
        const result = (typeof cond === 'function') ? cond(this.prevProps) : cond;
        this.prevProps = rest;
        return result;
    }

    render(props: any) {
        return props.children && props.children[0] || null;
    }
}

注意事項

<ShouldChildrenUpdate {...this.state} cond={shouldUpdate.bind(this)} >
    <Child count={this.state.count}>
        {[1, 2, 3].map(x => <div>{x}</div>)} // (1)
    </Child>
</ShouldChildrenUpdate>

(1)の計算は親コンポーネントスコープなので、updateは走らないが計算は親のrender毎に実行される