What is JSF and what are its top alternatives?
JavaServer Faces (JSF) is a Java web application framework that simplifies the development of user interfaces for Java EE applications. It provides a component-based architecture, reusable UI components, event-driven programming model, and integration with other Java EE technologies. However, some limitations of JSF include complexity, steep learning curve, and lack of flexibility in certain aspects of UI development.
- Spring MVC: Spring MVC is a part of the popular Spring Framework and provides a flexible model-view-controller architecture for building web applications. Key features include powerful data binding, declarative validation, and seamless integration with other Spring technologies. Pros of Spring MVC include ease of testing and a broad community base, while cons include potential configuration overhead.
- Vaadin: Vaadin is a Java framework for building modern web applications that allows developers to write server-side Java code for the entire application. Key features include a rich set of UI components, automatic data binding, and simplified communication between client and server. Pros of Vaadin include rapid development and platform independence, while a potential con is a steep learning curve for beginners.
- Apache Wicket: Apache Wicket is a component-based web application framework that aims to simplify web development by focusing on reusable components and object-oriented design. Key features include stateful components, ease of unit testing, and minimal configuration. Pros of Apache Wicket include strong type safety and scalability, while cons include complex URL handling.
- Play Framework: Play Framework is a reactive web framework for building modern web applications using Java or Scala. Key features include hot reloading, asynchronous programming, and lightweight architecture. Pros of Play Framework include high performance and developer productivity, while a potential con is a learning curve for beginners.
- Thymeleaf: Thymeleaf is a modern server-side Java template engine for web and standalone environments that focuses on natural templates and intuitive expressions. Key features include natural templating, integration with Spring Framework, and powerful expression language. Pros of Thymeleaf include easy integration with existing codebases and good performance, while a con is its limited support for complex UI interactions.
- Spark: Spark is a simple and expressive web framework for Java that aims to enable rapid development of web applications with minimal effort. Key features include a lightweight framework, easy routing, and template engine support. Pros of Spark include simplicity and ease of use, while a potential con is its limited built-in features compared to other frameworks.
- Dropwizard: Dropwizard is a Java framework for building RESTful web services with production-ready features out of the box. Key features include integrated metrics, health checks, and configuration management. Pros of Dropwizard include rapid development of RESTful services and operational excellence, while cons include potential constraints on architectural choices.
- GWT (Google Web Toolkit): GWT is an open-source set of tools that allows developers to write client-side Java code and compile it to highly optimized JavaScript. Key features include high-performance AJAX applications, reusable UI components, and easy debugging. Pros of GWT include strong Java development tools and platform independence, while cons include potential limitations in performance optimization.
- Vert.x: Vert.x is a reactive toolkit that allows developers to build high-performance, event-driven applications on the JVM. Key features include event bus communication, polyglot development support, and scalable architecture. Pros of Vert.x include low latency and high throughput, while a potential con is the need for appropriate expertise in reactive programming concepts.
- Ratpack: Ratpack is a set of Java libraries for building modern, asynchronous web applications with a focus on simplicity and performance. Key features include asynchronous I/O, functional APIs, and lightweight architecture. Pros of Ratpack include high performance and scalability, while a con could be a learning curve for developers new to asynchronous programming paradigms.
Top Alternatives to JSF
- AngularJS
AngularJS lets you write client-side web applications as if you had a smarter browser. It lets you use good old HTML (or HAML, Jade and friends!) as your template language and lets you extend HTML’s syntax to express your application’s components clearly and succinctly. It automatically synchronizes data from your UI (view) with your JavaScript objects (model) through 2-way data binding. ...
- Spring MVC
A Java framework that follows the Model-View-Controller design pattern and provides an elegant solution to use MVC in spring framework by the help of DispatcherServlet. ...
- Spring
A key element of Spring is infrastructural support at the application level: Spring focuses on the "plumbing" of enterprise applications so that teams can focus on application-level business logic, without unnecessary ties to specific deployment environments. ...
- Vaadin
It is the fastest way to build web applications in Java. It automates the communication between your server and the browser and gives you a high-level component API for all Vaadin components ...
- HTML5
HTML5 is a core technology markup language of the Internet used for structuring and presenting content for the World Wide Web. As of October 2014 this is the final and complete fifth revision of the HTML standard of the World Wide Web Consortium (W3C). The previous version, HTML 4, was standardised in 1997. ...
- JavaFX
It is a set of graphics and media packages that enables developers to design, create, test, debug, and deploy rich client applications that operate consistently across diverse platforms. ...
- PrimeFaces
It is a popular open source framework for JavaServer Faces featuring over 100 components, touch optimized mobilekit, client side validation, theme engine and more. ...
- React
Lots of people use React as the V in MVC. Since React makes no assumptions about the rest of your technology stack, it's easy to try it out on a small feature in an existing project. ...
JSF alternatives & related posts
- Quick to develop889
- Great mvc589
- Powerful573
- Restful520
- Backed by google505
- Two-way data binding349
- Javascript343
- Open source329
- Dependency injection307
- Readable197
- Fast75
- Directives65
- Great community63
- Free57
- Extend html vocabulary38
- Components29
- Easy to test26
- Easy to learn25
- Easy to templates24
- Great documentation23
- Easy to start21
- Awesome19
- Light weight18
- Angular 2.015
- Efficient14
- Javascript mvw framework14
- Great extensions14
- Easy to prototype with11
- High performance9
- Coffeescript9
- Two-way binding8
- Lots of community modules8
- Mvc8
- Easy to e2e7
- Clean and keeps code readable7
- One of the best frameworks6
- Easy for small applications6
- Works great with jquery5
- Fast development5
- I do not touch DOM4
- The two-way Data Binding is awesome4
- Hierarchical Data Structure3
- Be a developer, not a plumber.3
- Declarative programming3
- Typescript3
- Dart3
- Community3
- Fkin awesome2
- Opinionated in the right areas2
- Supports api , easy development2
- Common Place2
- Very very useful and fast framework for development2
- Linear learning curve2
- Great2
- Amazing community support2
- Readable code2
- Programming fun again2
- The powerful of binding, routing and controlling routes2
- Scopes2
- Consistency with backend architecture if using Nest2
- Fk react, all my homies hate react1
- Complex12
- Event Listener Overload3
- Dependency injection3
- Hard to learn2
- Learning Curve2
related AngularJS posts
Our whole Node.js backend stack consists of the following tools:
- Lerna as a tool for multi package and multi repository management
- npm as package manager
- NestJS as Node.js framework
- TypeScript as programming language
- ExpressJS as web server
- Swagger UI for visualizing and interacting with the API’s resources
- Postman as a tool for API development
- TypeORM as object relational mapping layer
- JSON Web Token for access token management
The main reason we have chosen Node.js over PHP is related to the following artifacts:
- Made for the web and widely in use: Node.js is a software platform for developing server-side network services. Well-known projects that rely on Node.js include the blogging software Ghost, the project management tool Trello and the operating system WebOS. Node.js requires the JavaScript runtime environment V8, which was specially developed by Google for the popular Chrome browser. This guarantees a very resource-saving architecture, which qualifies Node.js especially for the operation of a web server. Ryan Dahl, the developer of Node.js, released the first stable version on May 27, 2009. He developed Node.js out of dissatisfaction with the possibilities that JavaScript offered at the time. The basic functionality of Node.js has been mapped with JavaScript since the first version, which can be expanded with a large number of different modules. The current package managers (npm or Yarn) for Node.js know more than 1,000,000 of these modules.
- Fast server-side solutions: Node.js adopts the JavaScript "event-loop" to create non-blocking I/O applications that conveniently serve simultaneous events. With the standard available asynchronous processing within JavaScript/TypeScript, highly scalable, server-side solutions can be realized. The efficient use of the CPU and the RAM is maximized and more simultaneous requests can be processed than with conventional multi-thread servers.
- A language along the entire stack: Widely used frameworks such as React or AngularJS or Vue.js, which we prefer, are written in JavaScript/TypeScript. If Node.js is now used on the server side, you can use all the advantages of a uniform script language throughout the entire application development. The same language in the back- and frontend simplifies the maintenance of the application and also the coordination within the development team.
- Flexibility: Node.js sets very few strict dependencies, rules and guidelines and thus grants a high degree of flexibility in application development. There are no strict conventions so that the appropriate architecture, design structures, modules and features can be freely selected for the development.
Our whole Vue.js frontend stack (incl. SSR) consists of the following tools:
- Nuxt.js consisting of Vue CLI, Vue Router, vuex, Webpack and Sass (Bundler for HTML5, CSS 3), Babel (Transpiler for JavaScript),
- Vue Styleguidist as our style guide and pool of developed Vue.js components
- Vuetify as Material Component Framework (for fast app development)
- TypeScript as programming language
- Apollo / GraphQL (incl. GraphiQL) for data access layer (https://apollo.vuejs.org/)
- ESLint, TSLint and Prettier for coding style and code analyzes
- Jest as testing framework
- Google Fonts and Font Awesome for typography and icon toolkit
- NativeScript-Vue for mobile development
The main reason we have chosen Vue.js over React and AngularJS is related to the following artifacts:
- Empowered HTML. Vue.js has many similar approaches with Angular. This helps to optimize HTML blocks handling with the use of different components.
- Detailed documentation. Vue.js has very good documentation which can fasten learning curve for developers.
- Adaptability. It provides a rapid switching period from other frameworks. It has similarities with Angular and React in terms of design and architecture.
- Awesome integration. Vue.js can be used for both building single-page applications and more difficult web interfaces of apps. Smaller interactive parts can be easily integrated into the existing infrastructure with no negative effect on the entire system.
- Large scaling. Vue.js can help to develop pretty large reusable templates.
- Tiny size. Vue.js weights around 20KB keeping its speed and flexibility. It allows reaching much better performance in comparison to other frameworks.
related Spring MVC posts
Material Design for Angular Angular 2 Node.js TypeScript Spring-Boot RxJS Microsoft SQL Server Hibernate Spring MVC
We built our customer facing portal application using Angular frontend backed by Spring boot.
Spring
- Java230
- Open source157
- Great community136
- Very powerful123
- Enterprise114
- Lot of great subprojects64
- Easy setup60
- Convention , configuration, done44
- Standard40
- Love the logic31
- Good documentation13
- Dependency injection11
- Stability11
- MVC9
- Easy6
- Makes the hard stuff fun & the easy stuff automatic3
- Strong typing3
- Code maintenance2
- Best practices2
- Maven2
- Great Desgin2
- Easy Integration with Spring Security2
- Integrations with most other Java frameworks2
- Java has more support and more libraries1
- Supports vast databases1
- Large ecosystem with seamless integration1
- OracleDb integration1
- Live project1
- Draws you into its own ecosystem and bloat15
- Verbose configuration3
- Poor documentation3
- Java3
- Java is more verbose language in compare to python2
related Spring posts
Is learning Spring and Spring Boot for web apps back-end development is still relevant in 2021? Feel free to share your views with comparison to Django/Node.js/ ExpressJS or other frameworks.
Please share some good beginner resources to start learning about spring/spring boot framework to build the web apps.
I am consulting for a company that wants to move its current CubeCart e-commerce site to another PHP based platform like PrestaShop or Magento. I was interested in alternatives that utilize Node.js as the primary platform. I currently don't know PHP, but I have done full stack dev with Java, Spring, Thymeleaf, etc.. I am just unsure that learning a set of technologies not commonly used makes sense. For example, in PrestaShop, I would need to work with JavaScript better and learn PHP, Twig, and Bootstrap. It seems more cumbersome than a Node JS system, where the language syntax stays the same for the full stack. I am looking for thoughts and advice on the relevance of PHP skillset into the future AND whether the Node based e-commerce open source options can compete with Magento or Prestashop.
- Java9
- Compatibility7
- Open Source6
- Components6
- Performance3
- Abstraction2
- Example packages2
- OSGI Support1
- Paid for more features3
related Vaadin posts
HTML5
- New doctype447
- Local storage389
- Canvas334
- Semantic header and footer285
- Video element240
- Geolocation121
- Form autofocus106
- Email inputs100
- Editable content85
- Application caches79
- Easy to use10
- Cleaner Code9
- Easy5
- Websockets4
- Semantical4
- Better3
- Audio element3
- Modern3
- Portability2
- Semantic Header and Footer, Geolocation, New Doctype2
- Content focused2
- Compatible2
- Very easy to learning to HTML1
- Easy to forget the tags when you're a begginner1
- Long and winding code1
related HTML5 posts
Few years ago we were building a Next.js site with a few simple forms. This required handling forms validation and submission, but instead of picking some forms library, we went with plain JavaScript and constraint validation API in HTML5. This shaved off a few KBs of dependencies and gave us full control over the validation behavior and look. I describe this approach, with its pros and cons, in a blog post.
I needed to choose a full stack of tools for cross platform mobile application design & development. After much research and trying different tools, these are what I came up with that work for me today:
For the client coding I chose Framework7 because of its performance, easy learning curve, and very well designed, beautiful UI widgets. I think it's perfect for solo development or small teams. I didn't like React Native. It felt heavy to me and rigid. Framework7 allows the use of #CSS3, which I think is the best technology to come out of the #WWW movement. No other tech has been able to allow designers and developers to develop such flexible, high performance, customisable user interface elements that are highly responsive and hardware accelerated before. Now #CSS3 includes variables and flexboxes it is truly a powerful language and there is no longer a need for preprocessors such as #SCSS / #Sass / #less. React Native contains a very limited interpretation of #CSS3 which I found very frustrating after using #CSS3 for some years already and knowing its powerful features. The other very nice feature of Framework7 is that you can even build for the browser if you want your app to be available for desktop web browsers. The latest release also includes the ability to build for #Electron so you can have MacOS, Windows and Linux desktop apps. This is not possible with React Native yet.
Framework7 runs on top of Apache Cordova. Cordova and webviews have been slated as being slow in the past. Having a game developer background I found the tweeks to make it run as smooth as silk. One of those tweeks is to use WKWebView. Another important one was using srcset on images.
I use #Template7 for the for the templating system which is a no-nonsense mobile-centric #HandleBars style extensible templating system. It's easy to write custom helpers for, is fast and has a small footprint. I'm not forced into a new paradigm or learning some new syntax. It operates with standard JavaScript, HTML5 and CSS 3. It's written by the developer of Framework7 and so dovetails with it as expected.
I configured TypeScript to work with the latest version of Framework7. I consider TypeScript to be one of the best creations to come out of Microsoft in some time. They must have an amazing team working on it. It's very powerful and flexible. It helps you catch a lot of bugs and also provides code completion in supporting IDEs. So for my IDE I use Visual Studio Code which is a blazingly fast and silky smooth editor that integrates seamlessly with TypeScript for the ultimate type checking setup (both products are produced by Microsoft).
I use Webpack and Babel to compile the JavaScript. TypeScript can compile to JavaScript directly but Babel offers a few more options and polyfills so you can use the latest (and even prerelease) JavaScript features today and compile to be backwards compatible with virtually any browser. My favorite recent addition is "optional chaining" which greatly simplifies and increases readability of a number of sections of my code dealing with getting and setting data in nested objects.
I use some Ruby scripts to process images with ImageMagick and pngquant to optimise for size and even auto insert responsive image code into the HTML5. Ruby is the ultimate cross platform scripting language. Even as your scripts become large, Ruby allows you to refactor your code easily and make it Object Oriented if necessary. I find it the quickest and easiest way to maintain certain aspects of my build process.
For the user interface design and prototyping I use Figma. Figma has an almost identical user interface to #Sketch but has the added advantage of being cross platform (MacOS and Windows). Its real-time collaboration features are outstanding and I use them a often as I work mostly on remote projects. Clients can collaborate in real-time and see changes I make as I make them. The clickable prototyping features in Figma are also very well designed and mean I can send clickable prototypes to clients to try user interface updates as they are made and get immediate feedback. I'm currently also evaluating the latest version of #AdobeXD as an alternative to Figma as it has the very cool auto-animate feature. It doesn't have real-time collaboration yet, but I heard it is proposed for 2019.
For the UI icons I use Font Awesome Pro. They have the largest selection and best looking icons you can find on the internet with several variations in styles so you can find most of the icons you want for standard projects.
For the backend I was using the #GraphCool Framework. As I later found out, #GraphQL still has some way to go in order to provide the full power of a mature graph query language so later in my project I ripped out #GraphCool and replaced it with CouchDB and Pouchdb. Primarily so I could provide good offline app support. CouchDB with Pouchdb is very flexible and efficient combination and overcomes some of the restrictions I found in #GraphQL and hence #GraphCool also. The most impressive and important feature of CouchDB is its replication. You can configure it in various ways for backups, fault tolerance, caching or conditional merging of databases. CouchDB and Pouchdb even supports storing, retrieving and serving binary or image data or other mime types. This removes a level of complexity usually present in database implementations where binary or image data is usually referenced through an #HTML5 link. With CouchDB and Pouchdb apps can operate offline and sync later, very efficiently, when the network connection is good.
I use PhoneGap when testing the app. It auto-reloads your app when its code is changed and you can also install it on Android phones to preview your app instantly. iOS is a bit more tricky cause of Apple's policies so it's not available on the App Store, but you can build it and install it yourself to your device.
So that's my latest mobile stack. What tools do you use? Have you tried these ones?
- Light11
- Community support less than qt1
- Complicated1
related JavaFX posts
I create desktop applications that use a database for storing data. My applications are used as management tools in supermarkets, stores, warehouses, and other places. I don't know which one to use; Electron or JavaFX. Can anyone advise me on this matter?
- JEE Integration2
- Support Contract available1
- Nice Components1
- JSF1
- Some components have to be bought1
related PrimeFaces posts
Hello, I need to create a website using Java frameworks, the website must pull data from different mssql views , I'm thinking of using Spring Boot+PrimeFaces but someone suggested I should use Thymeleaf instead of primefaces, I don't have any experience in either, so I'm wondering if someone has some advice based on their own experience? thanks!
I need to modernize a Java web application that runs on JSF. I am used to building websites, so Bootstrap kinda feels like "home." But when it comes to applications, I feel Bootstrap is not the right way to go. Can someone explain to me what PrimeFaces is capable of in comparison with BS?
- Components832
- Virtual dom673
- Performance578
- Simplicity508
- Composable442
- Data flow186
- Declarative166
- Isn't an mvc framework128
- Reactive updates120
- Explicit app state115
- JSX50
- Learn once, write everywhere29
- Easy to Use22
- Uni-directional data flow21
- Works great with Flux Architecture17
- Great perfomance11
- Javascript10
- Built by Facebook9
- TypeScript support8
- Server Side Rendering6
- Speed6
- Feels like the 90s5
- Excellent Documentation5
- Props5
- Functional5
- Easy as Lego5
- Closer to standard JavaScript and HTML than others5
- Cross-platform5
- Easy to start5
- Hooks5
- Awesome5
- Scalable5
- Super easy4
- Allows creating single page applications4
- Server side views4
- Sdfsdfsdf4
- Start simple4
- Strong Community4
- Fancy third party tools4
- Scales super well4
- Has arrow functions3
- Beautiful and Neat Component Management3
- Just the View of MVC3
- Simple, easy to reason about and makes you productive3
- Fast evolving3
- SSR3
- Great migration pathway for older systems3
- Rich ecosystem3
- Simple3
- Has functional components3
- Every decision architecture wise makes sense3
- Very gentle learning curve3
- Split your UI into components with one true state2
- Image upload2
- Permissively-licensed2
- Fragments2
- Sharable2
- Recharts2
- HTML-like2
- React hooks1
- Datatables1
- Requires discipline to keep architecture organized41
- No predefined way to structure your app30
- Need to be familiar with lots of third party packages29
- JSX13
- Not enterprise friendly10
- One-way binding only6
- State consistency with backend neglected3
- Bad Documentation3
- Error boundary is needed2
- Paradigms change too fast2
related React posts
I was building a personal project that I needed to store items in a real time database. I am more comfortable with my Frontend skills than my backend so I didn't want to spend time building out anything in Ruby or Go.
I stumbled on Firebase by #Google, and it was really all I needed. It had realtime data, an area for storing file uploads and best of all for the amount of data I needed it was free!
I built out my application using tools I was familiar with, React for the framework, Redux.js to manage my state across components, and styled-components for the styling.
Now as this was a project I was just working on in my free time for fun I didn't really want to pay for hosting. I did some research and I found Netlify. I had actually seen them at #ReactRally the year before and deployed a Gatsby site to Netlify already.
Netlify was very easy to setup and link to my GitHub account you select a repo and pretty much with very little configuration you have a live site that will deploy every time you push to master.
With the selection of these tools I was able to build out my application, connect it to a realtime database, and deploy to a live environment all with $0 spent.
If you're looking to build out a small app I suggest giving these tools a go as you can get your idea out into the real world for absolutely no cost.
Your tech stack is solid for building a real-time messaging project.
React and React Native are excellent choices for the frontend, especially if you want to have both web and mobile versions of your application share code.
ExpressJS is an unopinionated framework that affords you the flexibility to use it's features at your term, which is a good start. However, I would recommend you explore Sails.js as well. Sails.js is built on top of Express.js and it provides additional features out of the box, especially the Websocket integration that your project requires.
Don't forget to set up Graphql codegen, this would improve your dev experience (Add Typescript, if you can too).
I don't know much about databases but you might want to consider using NO-SQL. I used Firebase real-time db and aws dynamo db on a few of my personal projects and I love they're easy to work with and offer more flexibility for a chat application.