{"id":20937030,"url":"https://github.com/fildon/react-native-research","last_synced_at":"2025-07-09T12:42:17.938Z","repository":{"id":220528631,"uuid":"751785879","full_name":"fildon/react-native-research","owner":"fildon","description":null,"archived":false,"fork":false,"pushed_at":"2024-02-02T14:51:15.000Z","size":303,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-19T20:17:44.930Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/fildon.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2024-02-02T10:21:56.000Z","updated_at":"2024-02-02T14:48:04.000Z","dependencies_parsed_at":"2024-02-02T15:51:18.669Z","dependency_job_id":null,"html_url":"https://github.com/fildon/react-native-research","commit_stats":null,"previous_names":["fildon/react-native-research"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fildon%2Freact-native-research","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fildon%2Freact-native-research/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fildon%2Freact-native-research/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fildon%2Freact-native-research/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fildon","download_url":"https://codeload.github.com/fildon/react-native-research/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243330325,"owners_count":20274039,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-18T22:31:38.552Z","updated_at":"2025-03-13T03:12:13.929Z","avatar_url":"https://github.com/fildon.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Native Research\n\nA simple \"hello world\" for react-native, to identify obstacles and opportunities.\n\n## Prerequisites\n\n- Node\n- Project dependencies\n    - \u003e npm i\n\n## Running Locally\n\n\u003e npx expo start\n\nWhen terminal is ready, press `w` to open the web app.\n\nHMR is enabled, so you should see code changes reflected in the browser instantly.\n\n## Findings So Far\n\n🔶 `react-native` styling is unit-less. This will limit capabilities for spacing and layout of web designs.\n\n🟥 `react-native-web` handles mapping `react-native` components into HTML DOM elements. However most of the time this appears to only output `div`s. This is antithetical to HTML semantics. We can claw back some semantics thanks to [react-native-web | Semantic HTML](https://necolas.github.io/react-native-web/docs/accessibility/#semantic-html), however this is very limited. There are over 150 different HTML elements but `react-native-web` supports mapping to only about 20 of them: [GitHub | propsToAccessibilityComponent](https://github.com/necolas/react-native-web/blob/e8a0cbc60af40bdac6505704ffe34764267cd77f/packages/react-native-web/src/modules/AccessibilityUtil/propsToAccessibilityComponent.js#L12). It is unlikely for this to ever improve, since cross-compatibility requires that any given component within `react-native` must have a way to render on all platforms. For example there is no `react-native` `table` component, because there is no sensible render target for mobile apps. Citation: [GitHub issues | Rejected support for `table` element](https://github.com/necolas/react-native-web/issues/2511#issuecomment-1514844650)\n\n🟢 TypeScript setup was painless.\n\n🔶 TypeScript typings provided by `react-native` do not correctly support `role=\"paragraph\"`, which is required for `react-native-web` to map a `Text` component to a `p` element.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffildon%2Freact-native-research","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffildon%2Freact-native-research","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffildon%2Freact-native-research/lists"}