Railslove We love to build the web. You might not need React: A Talk about Rails, JavaScript and Trade-Offs Marco Schaden [email protected] Jakob Hilden [email protected] <%= Date.today %>
1. Form is submitted via AJAX (UJS). 2. Server creates or updates a model object. 3. Server generates a JavaScript response that includes the rendered HTML template for the model. 4. Client evaluates the JavaScript returned by the server, which then updates the DOM.
3. Server generates a JavaScript response that includes the rendered HTML template for the model. *you also might not need jQuery btw ;) # app/views/messages/create.js.erb document.getElementById("message") .insertAdjacentHTML("afterbegin", "<%= j render @message %>")
Resources: A definitive guide to Rails’ unobtrusive JavaScript adapter https://m.patrikonrails.com/a-definitive-guide-to-railss-unobtrusive-javascript-adapter-ef13bd047fff Server-generated JavaScript Responses https://signalvnoise.com/posts/3697-server-generated-javascript-responses Working with JavaScript in Rails https://guides.rubyonrails.org/working_with_javascript_in_rails.html
Turbolinks makes navigating your web application faster.
Get the performance benefits of a single-page application without the added complexity of a client-side JavaScript framework. Use HTML to render your views on the server side and link to pages as usual. When you follow a link, Turbolinks automatically fetches the page, swaps in its , and merges its , all without incurring the cost of a full page load. README.md
Challenges of the Modern Rails approach: Features distributed over all layers “Basecamp style” has a smaller eco system Hard to build very “complex” UI ( lots of interdependent state ) No integrated solution for CSS
Modern Rails Hybrid Approach SPA + Rails API • THE fastest way to get a working product shipped (especially small teams) • simple requirements = simple solutions • less JS skills needed • supports any device that can show html
Challenges of the Hybrid approach: I18n Sharing CSS between React and Rails Node for server-side rendering => additional runtime dependency => harder to debug
Modern Rails Hybrid Approach SPA + Rails API • really great to extend and modernise "legacy" apps • component based design • easy integration that enables clean solutions for complex interactions • the strength of both eco systems • THE fastest way to get a working product shipped (especially small teams) • simple requirements = simple solutions • less JS skills needed • supports any device that can show html
Challenges SPA+API: API design (REST vs GraphQL) Fetch and serialize JSON Layer to handle errors Security and Authentication Duplicate logic, validations Dev setup and development Integration testing Deployment Slow devices and network
Modern Rails Hybrid Approach SPA + Rails API • THE fastest way to get a working product shipped (especially small teams) • simple requirements = simple solutions • less JS skills needed • supports any device that can show html • really great to extend and modernise "legacy" apps • component based design • easy integration that enables clean solutions for complex interactions • the strength of both eco systems • strategy for very big teams with separate departments and parallel projects • most versatile to support different clients and platforms • native look and feel • requires skilled developers /architects
Team Size Modern Rails Hybrid Approach SPA + Rails API Cross Platform Support Complexity (testability + maintainability) UI/UX Requirements small - mid mid big basic mid advanced low - manageable mid - high very high simple flexibel flexibel, native
donschado
mploed
pistatium
ewolff
sansantech
kazumax55
hamadakoji
yrhorita
hiashisan
linedevth
gaelvaroquaux
nagiss
konifar
nonsquared
jcasabona
scottboms
destraynor
danielanewman
cassininazir
aarron
sachag
searls
mraible
soudai
quramy