Nkzn

#! /usr/bin/ruby

# The MIT License (MIT)
# Copyright (c) 2016-2019 Yukiya Nakagawa <yn.airscope@gmail.com>
# Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
# The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
# THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OT

Nkzn

React NativeとReact DOMでVDOMの持ち方が違う気がするという話、調べてみたらやっぱりそうでした。

ReactDOMの場合

ReactDOMがReal DOMへの書き込みに使っているcommitUpdateという関数があります。 https://github.com/facebook/react/blob/3d8f465d99ece19238ccb561cdb157d2d676dda4/packages/react-dom/src/client/ReactDOM.js#L716

ReactDOMのほうは辿っていくとReal DOMのElementをゴリゴリ弄っている場所に辿り着けます https://github.com/facebook/react/blob/3d8f465d99ece19238ccb561cdb157d2d676dda4/packages/react-dom/src/client/DOMPropertyOperations.js#L116-L173

ReactNativeの場合

Nkzn

import React from 'react';

function Hoge(props) {
  const [count, setCount] = React.useState(0);
  const [loading, setLoading] = React.useState(false);
  const [error, setError] = React.useState(null);
  const [onceLoaded, setOnceLoaded] = React.useState(false);

  // 初回読み込み
  React.useEffect(() => {

Nkzn

#! /usr/bin/ruby

# The MIT License (MIT)
# Copyright (c) 2020 Yukiya Nakagawa <yn.airscope@gmail.com>
# Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
# The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
# THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWI

Nkzn

import React from 'react';
import { StyleProp, TextStyle, StyleSheet } from 'react-native';
import { Headline as PaperHeadline } from 'react-native-paper';

export const Headline = (props: {
  style?: StyleProp<TextStyle>;
  children: string;
}) =>
  React.cloneElement(
    <PaperHeadline style={StyleSheet.flatten([styles.headline, props.style])}>

Nkzn

export function publicFunction() {

}

function complexPrivateFunctionA() {
  
}

function complexPrivateFunctionB() {
  

Nkzn

git-pr-diff

Usage

1. Rename git-pr-diff.rb to git-pr-diff.
2. Move git-pr-diff into PATH ed folder.

Nkzn

import React from 'react';
import { View, Text } from 'react-native';
import { WebView } from 'react-native-webview';

const HybridComponent: React.FC = () => (
  <View>
    <Text>Rendering as native text with TextView/UIView</Text>
    <WebView>
      <View>
        <Text>Rendering as DOM tree with WebView/WkWebView</Text>

Nkzn

「うちのお客さんがね、Webサービス作りたいゆーんやけど」

「そうなんや」

「ユーザーへの届け方を忘れたらしいねん」

「ユーザーへの届け方を忘れるってどうなってんねん」

「いろいろ聞くんやけどな、全然わからへんねん」

Nkzn

#2d2d2d