{"id":17233955,"url":"https://github.com/caseywebdev/endr","last_synced_at":"2025-04-14T02:05:29.897Z","repository":{"id":235479429,"uuid":"790777758","full_name":"caseywebdev/endr","owner":"caseywebdev","description":"An Engine for DOM Recombobulation.","archived":false,"fork":false,"pushed_at":"2025-03-19T03:05:30.000Z","size":296,"stargazers_count":10,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-04-14T02:05:23.533Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://ca.sey.me/endr","language":"JavaScript","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/caseywebdev.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,"publiccode":null,"codemeta":null}},"created_at":"2024-04-23T14:06:36.000Z","updated_at":"2025-03-19T03:05:33.000Z","dependencies_parsed_at":"2024-04-23T15:31:02.379Z","dependency_job_id":"3d71020f-0b02-4fab-81cd-0f47186fe0cd","html_url":"https://github.com/caseywebdev/endr","commit_stats":null,"previous_names":["caseywebdev/endr"],"tags_count":14,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/caseywebdev%2Fendr","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/caseywebdev%2Fendr/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/caseywebdev%2Fendr/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/caseywebdev%2Fendr/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/caseywebdev","download_url":"https://codeload.github.com/caseywebdev/endr/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248809039,"owners_count":21164896,"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-10-15T05:27:40.381Z","updated_at":"2025-04-14T02:05:29.891Z","avatar_url":"https://github.com/caseywebdev.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Endr\nAn **En**gine for **D**OM **R**ecombobulation.\n\n```jsx\nimport { createRoot, useState } from 'endr';\n\nconst Root = () =\u003e {\n  const [count, setCount] = useState(0);\n\n  return (\n    \u003cdiv\u003e\n      \u003cbutton onclick={() =\u003e setCount(count + 1)}\u003eThis button\u003c/button\u003e{' '}\n      has been clicked {count} {count === 1 ? 'time' : 'times'}\n    \u003c/div\u003e\n  );\n};\n\ncreateRoot(document.body).render(\u003cRoot /\u003e);\n```\n\n# Why?\nEndr takes the best parts of React and ditches the rest to result in a lean and\nfast virtual DOM rendering library. React is a great tool but has acquired some\nbaggage over its long career that it must maintain for backwards compatibility.\nEndr loses the baggage and keeps the modern API.\n\n|Package|Size|\n|:-|-:|\n|Endr|\u003ca href=\"https://pkg-size.dev/endr\"\u003e\u003cimg src=\"https://pkg-size.dev/badge/bundle/5947\" title=\"Bundle size for endr\"\u003e\u003c/a\u003e|\n|Preact\u003cbr/\u003ePreact Hooks|\u003ca href=\"https://pkg-size.dev/preact\"\u003e\u003cimg src=\"https://pkg-size.dev/badge/bundle/11456\" title=\"Bundle size for preact\"\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://pkg-size.dev/preact-hooks\"\u003e\u003cimg src=\"https://pkg-size.dev/badge/bundle/13364\" title=\"Bundle size for preact-hooks\"\u003e\u003c/a\u003e|\n|React\u003cbr/\u003eReact DOM|\u003ca href=\"https://pkg-size.dev/react\"\u003e\u003cimg src=\"https://pkg-size.dev/badge/bundle/6882\" title=\"Bundle size for react\"\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://pkg-size.dev/react-dom\"\u003e\u003cimg src=\"https://pkg-size.dev/badge/bundle/141289\" title=\"Bundle size for react-dom\"\u003e\u003c/a\u003e|\n\n# Config\nUse `jsx: automatic` and `jsxImportSource: 'endr'` in your `tsconfig.json` and\nJSX transpiler (`babel`, `esbuild`, etc) to get correct autocomplete and\nrendered output. If you forget to do this you'll see errors about `React` not\nbeing found.\n\n# Differences from React\n- There are no class components.\n- There are no synthetic events.\n- There is no property redirection.\n  - All element properties should be passed as if you were setting them directly\n    on the element. For example `onclick` instead of `onClick` and `ondblclick`\n    instead of `onDoubleClick`.\n- `ref` is not a special property on function components (it is passed through\n  without something like `ForwardRef`).\n- `useRef` accepts an initializer function.\n- `createContext` returns the equivalent of a React `Context.Provider`\n  component.\n  - There is no `Context.Consumer` component. Access context values through\n    `useContext(Context)`.\n- `useCallback` does not take a second argument and will return a constant\n  function that will call the last seen function passed to `useCallback`. The\n  less common case of memoizing a callback that creates a new function when\n  dependencies change can be achieved with\n  `const sumAB = useMemo(() =\u003e () =\u003e a + b, [a, b])`.\n- `useMemo` can be called without a second argument to default to an empty\n  dependency array.\n- `setState` returns the most recently set value.\n- `setState` will not queue a re-render when it is called during the render\n  function.\n- There is no `useLayoutEffect`.\n- `useEffect` is called immediately after the DOM is reconciled.\n- Portals can be used with the `Portal` component instead of `createPortal`.\n  ```js\n  \u003cPortal to={parentElement}\u003e\u003cdiv /\u003e\u003c/Portal\u003e\n  ```\n  is equivalent to React's\n  ```js\n  createPortal(\u003cdiv /\u003e, parentElement)\n  ```\n- Exceptions thrown during render can be caught by the nearest Try component.\n  ```jsx\n  const MyComponent () =\u003e {\n    const [error, setError] = useState(undefined);\n\n    if (error) return `An error occurred! ${error}`;\n\n    return (\n      \u003cTry catch={setError}\u003e\n        \u003cAllMyChildren /\u003e\n      \u003c/Try\u003e\n    );\n  };\n  ```\n  can be used, for example, to show an error message whenever rendering\n    `\u003cAllMyChildren /\u003e` or any descendents throws an exception.\n  - React's `Suspense` can be recreated with `Try` by awaiting all thrown\n    promises, if desired.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcaseywebdev%2Fendr","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcaseywebdev%2Fendr","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcaseywebdev%2Fendr/lists"}