Closed ARKKYN closed 5 years ago
React-Slingshot is my goto starter for most projects, which ultimately led me to start contributing. It sounds like you are finding yourself in a similar situation. Community driven contributions are what makes open source projects all worth it.
If you haven't already, check out the docs on CONTRIBUTING. Any work you do won't go unnoticed long. @coryhouse and most of the other contributors are active regularly and quick to respond.
I say all this only because a few of the points you list relate to things you are absolutely free to build on your own, then create a Pull Request for and perhaps have it added to the project. Some potential PR's you could roll out based on what you've brought up are:
Dead code elimination for css and javascript React-Slingshot focuses on providing a better development experience. Production build enhancements are certainly welcome, so long as they aren't overly opinionated their implementation. PurgeCSS offers a nice compliment to the React-Slingshot environment as a whole. A quick glance at the docs shows it works in tandem with Webpack. I don't see any reason you couldn't add this fix in on your own :)
Enhanced Code splitting for this app Our current Webpack config files could use some updating. You could certainly give a go at editing the Webpack production config file with a solution like the split-chunks plugin.
Feature Requests are meant more for when, in adding the new feature, its consequence is noticeable across React-Slingshot's architecture design as a whole. As per the docs:
If you intend to change the public API, or make any non-trivial changes to the implementation, we recommend filing an issue. This lets us reach an agreement on your proposal before you put significant effort into it.
Also, in proposing a Feature Request, it's productive to include any potential working solutions you may have as well. This helps improve the overall context to the back and forth discussion had here. You listed:
Debugging tools for debugging " What debugging tools did you have in mind? Do those tools serve to compliment React-Slingshot's overall purpose and design?
Making features more modular like adding or removing a feature in the boilerplate via setup or by a script utility What features, in their current form, are you referencing and how are they holding back React-Slingshot? What additional scripting functionality would you like to see specifically?
I don't say any of this to argue. In fact, I agree with the overall sentiment you're proposing. Just need more detail on you're end in how we should do things.
Next, you listed:
The latter statement, I assume, is what you mean by "much more".
React-Slingshot does come with webpack-bundle-analyzer. Please be sure to review the project thoroughly, especially it's dependencies in the the package.json, first and foremost.
I do, however, disagree about adding links on "building high performance frontend react apps"; or even doing much additional improvement of the production build aspect of React-Slingshot. Other than the common performance tooling offered via mini, concat, uglyfy, code splitting and purging there are only so many ways to create performant, static assets. Front And performance also largely depends on the developer and their inherent knowledge on optimization when crafting the codebase.
Beyond that, application performance enhancement is derived from architectural design implementations and strategies commonly understood within the Back End realm of things. CDN's, load balancing, cache-busting, front-end proxies, streams, chunking, webserver options, persistence design; the list could go on and on. These are all solutions to improving performance, but are only useful to the context of the application they are meant to serve. Changing React-Slingshot to try and curtail to all performance options via the backend is an overly-opinionated move to make on the part of this project's purpose.
As a last note,
create-react-app, react-pwa, and react-boilerplate, like React-Slingshot, all act as starterkits for developing React apps. However, React-Slingshot does a great job at going a bit further than any of those options in what it gives devs out of the box in terms of overall tooling, without over doing it and becoming too opinionated in it's implementation. None of the alternatives you mentioned include Redux nor native support for SASS/SCSS (without a little work) among other perks in this project.
While React-Slingshot does add a bit of extra weight to the codebase, in my opinion, it's for good reason. I prefer this project over others mostly because of its adherence to consistent, best practice focussed React/Redux driven development, while also keeping concepts like "separation of concerns" in mind.
Hope you found this helpful. Looking forward to seeing your changes come through!
-Cheers!
I'll let the others chime in, but here are my thoughts.
For PurgeCSS, definitely put up a PR. I think it's a great addition. I use it on my own site (Gatsby powered). The one catch with it is you need to omit certain CSS from being purged if it's dynamically loaded later as Purge CSS eliminates all unused CSS at runtime. Here's an example in the context of Gatsby, where I need it to preserve prismjs CSS for my code blocks. , https://github.com/nickytonline/www.iamdeveloper.com/blob/master/gatsby-config.js#L192.
In regards to more advanced code splitting, to me that seems more like something you would do yourself in your own app as this is really a boilerplate to get started and we can't foresee all the ways developers might want to manage their code splitting, but feel free to open a PR to suggest some improvements.
I'm regards to debugging there is a section in the FAQ. As well if you have the Redux DevTools extension, you can debug all things Redux.
In regards to the bundle analyzer, as @DaneTheory mentioned, that's been in the project for quite a while now. See https://github.com/coryhouse/react-slingshot/blob/master/tools/analyzeBundle.js
will open pull request soon
@coryhouse MY CONTEXT REGARDING THIS FEATURE REQUEST: I have used react slingshot for couple of my projects even though it is good and easy to use . I have some feature requests , Since I benchmarked this boilerplate with create-react-app, react-pwa, react-boilerplate and few others I saw the build output of the final build is bigger compared to other boilerplate's build output . (Since It includes all the code in the build file which are not used)
My Main Suggestion: I was trying to add purgecss to remove unused css and other plugins to remove render blocking css, js and resources out of which one or two were unsuccessful I would like to suggest to add following for Good UI for a 100% google light house score and also make things easier -- Dead code elimination for css and javascript -- Add native support for Progressive web app -- Enhanced Code splitting for this app -- Debugging tools for debugging -- making features more modular like adding or removing a feature in the boilerplate via setup or by a script utility -- Performance audit tools like webpack-bundle-analyzer and much more
And Finally a readme with links for building high performance frontend react apps