react-virtualized
react-admin
Our great sponsors
react-virtualized | react-admin | |
---|---|---|
40 | 65 | |
25,951 | 24,029 | |
- | 1.8% | |
1.6 | 9.9 | |
4 months ago | 2 days ago | |
JavaScript | TypeScript | |
MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
react-virtualized
-
The Secret Weapon of Top Developers: 7 React JS Libraries You Can't Afford to Ignore
You may increase the rendering efficiency of tabular and huge list data by using the React Virtualized module. React apps perform better overall when the quantity of requests and DOM elements is limited. React Virtualized is comparable to many other tools; however, what sets it apart from the competition is the sheer volume of features and excellent upkeep.
-
33 React Libraries Every React Developer Should Have In Their Arsenal
17.react-virtualized
-
React Virtualisation from scratch
If you have been using React for awhile, you may have heard of the infamous virtualisation library react-window or it's predecessor react-virtualized
-
13 Must Know Libraries for a React Developer
React Virtualized is a React library that helps you work with large lists and tabular data efficiently in React. It has more than 25K stars on GitHub and more than 2.5 million weekly downloads on NPM as of August 2023.
-
Faster re-rending of table when only inserts are needed
Use virtualization (e.g. react-virtualized) to prevent off-screen components from actually rendering.
-
5 Tips for Optimizing ReactJS Performance and Building Lightning-Fast Applications
Virtualization can be achieved using third-party libraries like react-window or react-virtualized. These libraries provide a way to render only the visible data and load more data as needed, resulting in faster application performance.
-
Phoenix Dev Blog - Streams
You can implement the same pattern on the web when dealing with large amount of data. There are some libraries for React that trivialize this, like https://github.com/bvaughn/react-virtualized
-
Introducing Suspense: APIs to simplify data loading and caching, for use with React Suspense.
Oh, right. I totally forgot to mention that– but the idea of "less rendering" in this case seems less like a Suspense concern and more like a windowing concern. I've written a few libraries for that stuff (react-window and react-virtualized) although there are others that may fit your needs better. Their main focus is limiting what you're rendering to more or less only what's on the screen at any given point. Combine that with memoized filtering and I would imagine you're set.
-
Best infinity scroll?
I've used the InfiniteLoader from react-virtualized in combination with useInfiniteQuery from @tanstack/react-query and it was relatively painless.
-
Thoughts on this Timeline design I've been working on?
Here’s a react library https://github.com/bvaughn/react-virtualized
react-admin
-
Ask HN: Does Anyone Use a "Closed Core" Software Model?
> "Are there examples of companies adopting this model?"
Many examples across the industry:
- Autodesk AutoCAD (closed) + Plugins/Addons (many open)
- MS Windows (closed) + Many 3rd party programs (open)
- Github (closed) + Github Actions (open)
- Npm (closed) + Npm modules (mostly open)
> "What are the potential benefits or pitfalls?"
Benefits:
- Harder to replicate, the company gets to keep the "secret sauce" a secret
- Opening up a way to "extend" the platform means 3rd party developers add value to your system
- The core isn't open, so less effort is required to maintain compare to OpenSource
Pitfalls:
- Closed-source is hard to verify, company is essentially saying "trust me bro"
- Less innovation, as user's can't contribute to the core
> "How does it impact community engagement and software adoption?"
There's hardcore FOSS advocates that will hate anything not fully open. But a business has to make money and protect it's IP, having a "closed core" is one way to do that and ensure a sustainable business model.
Another approach is the opposite, open-core + closed-premium-addons. An example of this is "React Admin"
- Open Core -> https://github.com/marmelab/react-admin
- Premium Modules Offering -> https://react-admin-ee.marmelab.com/
-
React Component Libraries
Official Website: https://marmelab.com/react-admin/
-
Building an Admin Console With Minimum Code Using React-Admin, Prisma, and Zenstack
React-Admin is a React-based frontend framework for building admin applications that talk to a backend data API. It offers a pluggable mechanism for easily adapting to the specific API style of your backend.
-
New client-side hooks coming to React 19
With these features, data fetching and forms become significantly easier to implement in React. However, creating a great user experience involves integrating all these hooks, which can be complex. Alternatively, you can use a framework like react-admin where user-friendly forms with optimistic updates are built-in.
-
33 React Libraries Every React Developer Should Have In Their Arsenal
31.react-admin
-
I absolutely despise front-end work and styling, (and JS too), coming from a C++ / Java background, what would be a good framework or anything really to make it as painless as possible for me to build a front end.
For the admin panel, or basically anything with basic crud operations, take a look at https://marmelab.com/react-admin/. Most frontend devs don't like it, since it limits you somewhat in customization, but at the same time, it is very easy to grasp for someone coming from a backend dev profile, who just wants a crud UI. It even has a guesser template that proposes an initial screen layout based on the response of your api, which you can then copy-paste and finetune. It is really made to make quick admin crud ui's.
-
Anatomy Of A Profitable Open-Source Project
We’ve developed a business based on an open-source platform called react-admin. Embracing the open-source spirit, we’re sharing the key performance indicators of this business. We hope it will help other open-source developers build their own business.
-
An Overview of 25+ UI Component Libraries in 2023
React-Admin: As the name suggests, this component library is targeted at building administrator interfaces for B2B (business-to-business), for example, managing users in your system. It is based on Material design and has a neat feature where you can let it “guess” your list views by providing a sample API endpoint for your data.
- Launch HN: Refine (YC S23) – Open-Source Retool for Enterprise
-
Pros and cons of off-the-shelf solutions for creating a control panel
- We want a solution that creates CRUD (create, read, update, delete) quickly and requires minimal effort. - We want to be able to create some sort of complex interface if the task requires it. - We make cool, beautiful projects, so we want a visually pleasing solution. - We want the solution to be independent of the language on the back-end, because, for example, we started with PHP, Laravel, but over time node.js, Go appeared in the stack. In short, we want fast, beautiful and custom. We've had time to poke at various off-the-shelf solutions that we've been advised. They're good, but: - they are created specifically for some frameworks / languages like laravel, node.js - they can only generate CRUDs with a rigidly defined structure, where you can't implement or customize anything of your own. - they can't be styled Here's what we've been looking at Control Panels for Laravel: https://demo.backpackforlaravel.com/admin/dashboard Not a very pretty solution in our opinion. And the promo page has nice screenshots, not the demo "well such". https://orchid.software/en/ Not particularly functional, but neatly done https://nova.laravel.com They have a beautiful, but rigidly set strutkrua, you can not create castmon interfaces, stylize them. Just do CRUD and that's it. And it's paid https://filamentphp.com/ Analog to Nova, with essentially the same problems. For node.js: https://adminjs.co Nice promo, and the demo is way behind As standalone dashboards: https://strapi.io/ Very cool, but for other purposes. It's more of an entity builder with an interface and API https://pocketbase.io/ Similarly, it's an entity builder with an interface and API https://directus.io/ This is a backend builder. https://filamentphp.com/It is purely for php, you can't customize styles, you can't create your own interfaces. It is possible to create only tables and forms by template, and we remember that we want flexibility, independence from the language and the ability to create their own interfaces and customize them https://flatlogic.com This is also more of a backend builder. Direct competitors: https://github.com/refinedev/refine https://marmelab.com/react-admin/is probably the best solution that is currently on the market, they have been developing for a long time, they are our favorite. To the disadvantages we considered the following points: quite an old project, and somewhere the technology is already outdated, unsympathetic interface, old UI libraries. Huge documentation, it’s simply to create CRUD but hard to work without immersion. After all this there is only one conclusion: you need to do it yourself....
What are some alternatives?
react-lazyload - Lazy load your component, image or anything matters the performance.
tailwind-dashboard-template - Mosaic Lite is a free admin dashboard template built on top of Tailwind CSS and fully coded in React. Made by
react-window - React components for efficiently rendering large lists and tabular data
Refine - A React Framework for building internal tools, admin panels, dashboards & B2B apps with unmatched flexibility.
react-virtual - 🤖 Headless UI for Virtualizing Large Element Lists in JS/TS, React, Solid, Vue and Svelte [Moved to: https://github.com/TanStack/virtual]
AdminJS - AdminJS is an admin panel for apps written in node.js
streamlit - Streamlit — A faster way to build and share data apps.
refine - Build your React-based CRUD applications, without constraints. [Moved to: https://github.com/refinedev/refine]
react-virtuoso - The most powerful virtual list component for React
mantine - A fully featured React components library
vite - Next generation frontend tooling. It's fast!
appsmith - Platform to build admin panels, internal tools, and dashboards. Integrates with 25+ databases and any API.