react_on_rails_pro 16.2.0.beta.8

data/lib/react_on_rails_pro/server_rendering_js_code.rb

@@ -0,0 +1,102 @@
+# frozen_string_literal: true
+
+module ReactOnRailsPro
+  module ServerRenderingJsCode
+    class << self
+      def ssr_pre_hook_js
+        ReactOnRailsPro.configuration.ssr_pre_hook_js || ""
+      end
+
+      # Generates the JavaScript function used for React Server Components payload generation
+      # Returns the JavaScript code that defines the generateRSCPayload function.
+      # It also adds necessary information to the railsContext to generate the RSC payload for any component in the app.
+      # @return [String] JavaScript code for RSC payload generation
+      def generate_rsc_payload_js_function(render_options)
+        return "" unless ReactOnRailsPro.configuration.enable_rsc_support && render_options.streaming?
+
+        if render_options.rsc_payload_streaming?
+          # When already on RSC bundle, we prevent further RSC payload generation
+          # by throwing an error if generateRSCPayload is called
+          return <<-JS
+            if (typeof generateRSCPayload !== 'function') {
+              globalThis.generateRSCPayload = function generateRSCPayload() {
+                throw new Error('The rendering request is already running on the RSC bundle. Please ensure that generateRSCPayload is only called from any React Server Component.')
+              }
+            }
+          JS
+        end
+
+        # To minimize the size of the HTTP request body sent to the node renderer,
+        # we reuse the existing rendering request string within the generateRSCPayload function.
+        # This approach allows us to simply replace the component name and props,
+        # rather than rewriting the entire rendering request.
+        # This regex finds the empty function call pattern `()` and replaces it with the component and props
+        <<-JS
+        railsContext.serverSideRSCPayloadParameters = {
+          renderingRequest,
+          rscBundleHash: '#{ReactOnRailsPro::Utils.rsc_bundle_hash}',
+        }
+        if (typeof generateRSCPayload !== 'function') {
+          globalThis.generateRSCPayload = function generateRSCPayload(componentName, props, railsContext) {
+            const { renderingRequest, rscBundleHash } = railsContext.serverSideRSCPayloadParameters;
+            const propsString = JSON.stringify(props);
+            const newRenderingRequest = renderingRequest.replace(/\\(\\s*\\)\\s*$/, `('${componentName}', ${propsString})`);
+            return runOnOtherBundle(rscBundleHash, newRenderingRequest);
+          }
+        }
+        JS
+      end
+
+      # Main rendering function that generates JavaScript code for server-side rendering
+      # @param props_string [String] JSON string of props to pass to the React component
+      # @param rails_context [String] JSON string of Rails context data
+      # @param redux_stores [String] JavaScript code for Redux stores initialization
+      # @param react_component_name [String] Name of the React component to render
+      # @param render_options [Object] Options that control the rendering behavior
+      # @return [String] JavaScript code that will render the React component on the server
+      def render(props_string, rails_context, redux_stores, react_component_name, render_options)
+        render_function_name =
+          if ReactOnRailsPro.configuration.enable_rsc_support && render_options.streaming?
+            # Select appropriate function based on whether the rendering request is running on server or rsc bundle
+            # As the same rendering request is used to generate the rsc payload and SSR the component.
+            "ReactOnRails.isRSCBundle ? 'serverRenderRSCReactComponent' : 'streamServerRenderedReactComponent'"
+          else
+            "'serverRenderReactComponent'"
+          end
+        rsc_params = if ReactOnRailsPro.configuration.enable_rsc_support && render_options.streaming?
+                       config = ReactOnRailsPro.configuration
+                       react_client_manifest_file = config.react_client_manifest_file
+                       react_server_client_manifest_file = config.react_server_client_manifest_file
+                       <<-JS
+                          railsContext.reactClientManifestFileName = '#{react_client_manifest_file}';
+                          railsContext.reactServerClientManifestFileName = '#{react_server_client_manifest_file}';
+                       JS
+                     else
+                       ""
+                     end
+
+        # This function is called with specific componentName and props when generateRSCPayload is invoked
+        # In that case, it replaces the empty () with ('componentName', props) in the rendering request
+        <<-JS
+        (function(componentName = '#{react_component_name}', props = undefined) {
+          var railsContext = #{rails_context};
+          #{rsc_params}
+          #{generate_rsc_payload_js_function(render_options)}
+          #{ssr_pre_hook_js}
+          #{redux_stores}
+          var usedProps = typeof props === 'undefined' ? #{props_string} : props;
+          return ReactOnRails[#{render_function_name}]({
+            name: componentName,
+            domNodeId: '#{render_options.dom_id}',
+            props: usedProps,
+            trace: #{render_options.trace},
+            railsContext: railsContext,
+            throwJsErrors: #{ReactOnRailsPro.configuration.throw_js_errors},
+            renderingReturnsPromises: #{ReactOnRailsPro.configuration.rendering_returns_promises},
+          });
+        })()
+        JS
+      end
+    end
+  end
+end

data/lib/react_on_rails_pro/server_rendering_pool/node_rendering_pool.rb

@@ -0,0 +1,133 @@
+# frozen_string_literal: true
+
+module ReactOnRailsPro
+  module ServerRenderingPool
+    # This implementation of the rendering pool uses NodeJS to execute javasript code
+    class NodeRenderingPool
+      RENDERED_HTML_KEY = "renderedHtml"
+
+      class << self
+        attr_reader :bundle_hash
+
+        def reset_pool
+          ReactOnRailsPro::Request.reset_connection
+        end
+
+        def reset_pool_if_server_bundle_was_modified
+          # Resetting the pool for server bundle modifications is accomplished by changing the mtime
+          # of the server bundle in the request to the remote rendering server.
+          # In non-development mode, we don't need to re-read this value.
+          if @server_bundle_hash.blank? || ReactOnRails.configuration.development_mode
+            @server_bundle_hash = ReactOnRailsPro::Utils.bundle_hash
+          end
+
+          unless ReactOnRailsPro.configuration.enable_rsc_support &&
+                 (@rsc_bundle_hash.blank? || ReactOnRails.configuration.development_mode)
+            return
+          end
+
+          @rsc_bundle_hash = ReactOnRailsPro::Utils.rsc_bundle_hash
+        end
+
+        def renderer_bundle_file_name
+          "#{ReactOnRailsPro::Utils.bundle_hash}.js"
+        end
+
+        def rsc_renderer_bundle_file_name
+          "#{ReactOnRailsPro::Utils.rsc_bundle_hash}.js"
+        end
+
+        # js_code: JavaScript expression that returns a string.
+        # Returns a Hash:
+        #   html: string of HTML for direct insertion on the page by evaluating js_code
+        #   consoleReplayScript: script for replaying console
+        #   hasErrors: true if server rendering errors
+        # Note, js_code does not have to be based on React.
+        # js_code MUST RETURN json stringify Object
+        # Calling code will probably call 'html_safe' on return value before rendering to the view.
+        def exec_server_render_js(js_code, render_options)
+          # The secret sauce is passing self as the 3rd param, the js_evaluator
+          render_options.set_option(:throw_js_errors, ReactOnRailsPro.configuration.throw_js_errors)
+          ReactOnRails::ServerRenderingPool::RubyEmbeddedJavaScript
+            .exec_server_render_js(js_code, render_options, self)
+        end
+
+        def eval_streaming_js(js_code, render_options)
+          path = prepare_render_path(js_code, render_options)
+          ReactOnRailsPro::Request.render_code_as_stream(
+            path,
+            js_code,
+            is_rsc_payload: ReactOnRailsPro.configuration.enable_rsc_support && render_options.rsc_payload_streaming?
+          )
+        end
+
+        def eval_js(js_code, render_options, send_bundle: false)
+          path = prepare_render_path(js_code, render_options)
+
+          response = ReactOnRailsPro::Request.render_code(path, js_code, send_bundle)
+
+          case response.status
+          when 200
+            response.body
+          when ReactOnRailsPro::STATUS_SEND_BUNDLE
+            # To prevent infinite loop
+            ReactOnRailsPro::Error.raise_duplicate_bundle_upload_error if send_bundle
+
+            eval_js(js_code, render_options, send_bundle: true)
+          when 400
+            raise ReactOnRailsPro::Error,
+                  "Renderer unhandled error at the VM level: #{response.status}:\n#{response.body}"
+          else
+            raise ReactOnRailsPro::Error,
+                  "Unexpected response code from renderer: #{response.status}:\n#{response.body}"
+          end
+        rescue StandardError => e
+          raise e unless ReactOnRailsPro.configuration.renderer_use_fallback_exec_js
+
+          fallback_exec_js(js_code, render_options, e)
+        end
+
+        def server_bundle_hash
+          @server_bundle_hash ||= ReactOnRailsPro::Utils.bundle_hash
+        end
+
+        def rsc_bundle_hash
+          @rsc_bundle_hash ||= ReactOnRailsPro::Utils.rsc_bundle_hash
+        end
+
+        def prepare_render_path(js_code, render_options)
+          ReactOnRailsPro::ServerRenderingPool::ProRendering
+            .set_request_digest_on_render_options(js_code, render_options)
+
+          rsc_support_enabled = ReactOnRailsPro.configuration.enable_rsc_support
+          is_rendering_rsc_payload = rsc_support_enabled && render_options.rsc_payload_streaming?
+          bundle_hash = is_rendering_rsc_payload ? rsc_bundle_hash : server_bundle_hash
+          # TODO: Remove the request_digest. See https://github.com/shakacode/react_on_rails_pro/issues/119
+          # From the request path
+          # path = "/bundles/#{@bundle_hash}/render"
+          "/bundles/#{bundle_hash}/render/#{render_options.request_digest}"
+        end
+
+        def fallback_exec_js(js_code, render_options, error)
+          Rails.logger.warn do
+            "[ReactOnRailsPro] Falling back to ExecJS because of #{error}"
+          end
+          fallback_renderer = ReactOnRails::ServerRenderingPool::RubyEmbeddedJavaScript
+
+          # Pool is actually discarded btw requests:
+          # 1) not to keep ExecJS in memory once NodeRenderer is available back
+          # 2) to avoid issues with server bundle changes
+          fallback_renderer.reset_pool
+          result = fallback_renderer.eval_js(js_code, render_options)
+          fallback_renderer.instance_variable_set(:@js_context_pool, nil)
+          result
+        end
+
+        if defined?(ScoutApm)
+          include ScoutApm::Tracer
+          instrument_method :exec_server_render_js, type: "ReactOnRails", name: "Node React Server Rendering"
+        end
+      end
+    end
+  end
+end

data/lib/react_on_rails_pro/server_rendering_pool/pro_rendering.rb

@@ -0,0 +1,117 @@
+# frozen_string_literal: true
+
+module ReactOnRailsPro
+  module ServerRenderingPool
+    class ProRendering
+      RENDERED_HTML_KEY = "renderedHtml"
+
+      class << self
+        def pool
+          @pool ||= if ReactOnRailsPro.configuration.node_renderer?
+                      ::ReactOnRailsPro::ServerRenderingPool::NodeRenderingPool
+                    else
+                      ::ReactOnRails::ServerRenderingPool::RubyEmbeddedJavaScript
+                    end
+        end
+
+        delegate :reset_pool_if_server_bundle_was_modified, :reset_pool, to: :pool
+
+        def exec_server_render_js(js_code, render_options)
+          ::ReactOnRailsPro::Utils.with_trace(render_options.react_component_name) do
+            # See https://github.com/shakacode/react_on_rails_pro/issues/119 for why
+            # the digest is on the render options.
+            # TODO: the request digest should be removed unless prerender caching is used
+            set_request_digest_on_render_options(js_code, render_options)
+
+            # Cache non-streaming immediately. For streaming, optionally cache via write-through.
+            if cache_enabled_for?(render_options)
+              render_with_cache(js_code, render_options)
+            else
+              render_on_pool(js_code, render_options)
+            end
+          end
+        end
+
+        # See https://github.com/shakacode/react_on_rails_pro/issues/119 for why
+        # the digest is on the render options.
+        def set_request_digest_on_render_options(js_code, render_options)
+          return unless render_options.request_digest.blank?
+
+          digest = if render_options.random_dom_id?
+                     Rails.logger.info do
+                       "[ReactOnRailsPro] Rendering #{render_options.react_component_name}. " \
+                         "Suggest setting `id` on react_component or setting react_on_rails.rb initializer " \
+                         "config.random_dom_id to false for BETTER performance."
+                     end
+                     Digest::MD5.hexdigest(without_random_values(js_code))
+                   else
+                     Digest::MD5.hexdigest(js_code)
+                   end
+          render_options.request_digest = digest
+        end
+
+        private
+
+        def cache_enabled_for?(render_options)
+          ReactOnRailsPro.configuration.prerender_caching &&
+            render_options.internal_option(:skip_prerender_cache).nil?
+        end
+
+        def render_with_cache(js_code, render_options)
+          prerender_cache_key = cache_key(js_code, render_options)
+          prerender_cache_hit = true
+
+          result = if render_options.streaming?
+                     render_streaming_with_cache(prerender_cache_key, js_code, render_options)
+                   else
+                     Rails.cache.fetch(prerender_cache_key) do
+                       prerender_cache_hit = false
+                       render_on_pool(js_code, render_options)
+                     end
+                   end
+
+          # Pass back the cache key in the results only if the result is a Hash
+          if result.is_a?(Hash)
+            result[:RORP_CACHE_KEY] = prerender_cache_key
+            result[:RORP_CACHE_HIT] = prerender_cache_hit
+          end
+
+          result
+        end
+
+        def render_streaming_with_cache(prerender_cache_key, js_code, render_options)
+          # Streaming path: try to serve from cache; otherwise wrap upstream stream
+          cached_stream = ReactOnRailsPro::StreamCache.fetch_stream(prerender_cache_key)
+          return cached_stream if cached_stream
+
+          upstream = render_on_pool(js_code, render_options)
+          ReactOnRailsPro::StreamCache.wrap_and_cache(
+            prerender_cache_key,
+            upstream,
+            cache_options: render_options.internal_option(:cache_options)
+          )
+        end
+
+        def without_random_values(js_code)
+          # domNodeId are random to enable multiple instance of the same react component on a page.
+          # See https://github.com/shakacode/react_on_rails_pro/issues/44
+          js_code.gsub(/domNodeId: '[\w-]*',/, "")
+        end
+
+        def cache_key(js_code, render_options)
+          set_request_digest_on_render_options(js_code, render_options)
+
+          [
+            *ReactOnRailsPro::Cache.base_cache_key("ror_pro_rendered_html",
+                                                   prerender: render_options.prerender),
+            render_options.request_digest
+          ]
+        end
+
+        def render_on_pool(js_code, render_options)
+          pool.exec_server_render_js(js_code, render_options)
+        end
+      end
+    end
+  end
+end

data/lib/react_on_rails_pro/stream_cache.rb

@@ -0,0 +1,61 @@
+# frozen_string_literal: true
+
+module ReactOnRailsPro
+  class StreamCache
+    class << self
+      # Returns a stream-like object that responds to `each_chunk` and yields cached chunks
+      # or nil if not present in cache.
+      def fetch_stream(cache_key)
+        cached_chunks = Rails.cache.read(cache_key)
+        return nil unless cached_chunks.is_a?(Array)
+
+        build_stream_from_chunks(cached_chunks)
+      end
+
+      # Wraps an upstream stream (responds to `each_chunk`), yields chunks downstream while
+      # buffering them, and writes the chunks array to Rails.cache on successful completion.
+      # Returns a stream-like object that responds to `each_chunk`.
+      def wrap_and_cache(cache_key, upstream_stream, cache_options: nil)
+        component = CachingComponent.new(upstream_stream, cache_key, cache_options)
+        ReactOnRailsPro::StreamDecorator.new(component)
+      end
+
+      # Builds a stream-like object from an array of chunks.
+      def build_stream_from_chunks(chunks)
+        component = CachedChunksComponent.new(chunks)
+        ReactOnRailsPro::StreamDecorator.new(component)
+      end
+    end
+
+    class CachedChunksComponent
+      def initialize(chunks)
+        @chunks = chunks
+      end
+
+      def each_chunk(&block)
+        return enum_for(:each_chunk) unless block
+
+        @chunks.each(&block)
+      end
+    end
+
+    class CachingComponent
+      def initialize(upstream_stream, cache_key, cache_options)
+        @upstream_stream = upstream_stream
+        @cache_key = cache_key
+        @cache_options = cache_options
+      end
+
+      def each_chunk(&block)
+        return enum_for(:each_chunk) unless block
+
+        buffered_chunks = []
+        @upstream_stream.each_chunk do |chunk|
+          buffered_chunks << chunk
+          yield(chunk)
+        end
+        Rails.cache.write(@cache_key, buffered_chunks, @cache_options || {})
+      end
+    end
+  end
+end

data/lib/react_on_rails_pro/stream_request.rb

@@ -0,0 +1,170 @@
+# frozen_string_literal: true
+
+module ReactOnRailsPro
+  class StreamDecorator
+    def initialize(component)
+      @component = component
+      # @type [Array[Proc]]
+      # Proc receives 2 arguments: chunk, position
+      # @param chunk [String] The chunk to be processed
+      # @param position [Symbol] The position of the chunk in the stream (:first, :middle, or :last)
+      # The position parameter is used by actions that add content to the beginning or end of the stream
+      @actions = [] # List to store all actions
+      @rescue_blocks = []
+    end
+
+    # Add a prepend action
+    def prepend
+      @actions << ->(chunk, position) { position == :first ? "#{yield}#{chunk}" : chunk }
+      self # Return self to allow chaining
+    end
+
+    # Add a transformation action
+    def transform
+      @actions << lambda { |chunk, position|
+        if position == :last && chunk.empty?
+          # Return the empty chunk without modification for the last chunk
+          # This is related to the `handleChunk(:last, "")` call which gets all the appended content
+          # We don't want to make an extra call to the transformer block if there is no content appended
+          chunk
+        else
+          yield(chunk)
+        end
+      }
+      self # Return self to allow chaining
+    end
+
+    # Add an append action
+    def append
+      @actions << ->(chunk, position) { position == :last ? "#{chunk}#{yield}" : chunk }
+      self # Return self to allow chaining
+    end
+
+    def rescue(&block)
+      @rescue_blocks << block
+      self # Return self to allow chaining
+    end
+
+    def handle_chunk(chunk, position)
+      @actions.reduce(chunk) do |acc, action|
+        action.call(acc, position)
+      end
+    end
+
+    def each_chunk(&block) # rubocop:disable Metrics/CyclomaticComplexity
+      return enum_for(:each_chunk) unless block
+
+      first_chunk = true
+      @component.each_chunk do |chunk|
+        position = first_chunk ? :first : :middle
+        modified_chunk = handle_chunk(chunk, position)
+        yield(modified_chunk)
+        first_chunk = false
+      end
+
+      # The last chunk contains the append content after the transformation
+      # All transformations are applied to the append content
+      last_chunk = handle_chunk("", :last)
+      yield(last_chunk) unless last_chunk.empty?
+    rescue StandardError => e
+      current_error = e
+      rescue_block_index = 0
+      while current_error.present? && (rescue_block_index < @rescue_blocks.size)
+        begin
+          @rescue_blocks[rescue_block_index].call(current_error, &block)
+          current_error = nil
+        rescue StandardError => inner_error
+          current_error = inner_error
+        end
+        rescue_block_index += 1
+      end
+      raise current_error if current_error.present?
+    end
+  end
+
+  class StreamRequest
+    def initialize(&request_block)
+      @request_executor = request_block
+    end
+
+    private_class_method :new
+
+    def each_chunk(&block)
+      return enum_for(:each_chunk) unless block
+
+      send_bundle = false
+      error_body = +""
+      loop do
+        stream_response = @request_executor.call(send_bundle)
+
+        # Chunks can be merged during streaming, so we separate them by newlines
+        # Also, we check the status code inside the loop block because calling `status` outside the loop block
+        # is blocking, it will wait for the response to be fully received
+        # Look at the spec of `status` in `spec/react_on_rails_pro/stream_spec.rb` for more details
+        process_response_chunks(stream_response, error_body, &block)
+        break
+      rescue HTTPX::HTTPError => e
+        send_bundle = handle_http_error(e, error_body, send_bundle)
+      rescue HTTPX::ReadTimeoutError => e
+        raise ReactOnRailsPro::Error, "Time out error while server side render streaming a component.\n" \
+                                      "Original error:\n#{e}\n#{e.backtrace}"
+      end
+    end
+
+    def process_response_chunks(stream_response, error_body)
+      loop_response_lines(stream_response) do |chunk|
+        if stream_response.is_a?(HTTPX::ErrorResponse) || stream_response.status >= 400
+          error_body << chunk
+          next
+        end
+
+        processed_chunk = chunk.strip
+        yield processed_chunk unless processed_chunk.empty?
+      end
+    end
+
+    def handle_http_error(error, error_body, send_bundle)
+      response = error.response
+      case response.status
+      when ReactOnRailsPro::STATUS_SEND_BUNDLE
+        # To prevent infinite loop
+        ReactOnRailsPro::Error.raise_duplicate_bundle_upload_error if send_bundle
+
+        true
+      when ReactOnRailsPro::STATUS_INCOMPATIBLE
+        raise ReactOnRailsPro::Error, error_body
+      else
+        raise ReactOnRailsPro::Error, "Unexpected response code from renderer: #{response.status}:\n#{error_body}"
+      end
+    end
+
+    # Method to start the decoration
+    def self.create(&request_block)
+      StreamDecorator.new(new(&request_block))
+    end
+
+    private
+
+    # This method is considered as an override of response.each_line
+    # It fixes the problem of not yielding the last chunk on error
+    # You can check the spec of `each_line` in `spec/react_on_rails_pro/stream_spec.rb` for more details
+    def loop_response_lines(response)
+      return enum_for(__method__, response) unless block_given?
+
+      line = "".b
+
+      response.each do |chunk|
+        response.instance_variable_set(:@react_on_rails_received_first_chunk, true)
+        line << chunk
+
+        while (idx = line.index("\n"))
+          yield line.byteslice(0..idx - 1)
+
+          line = line.byteslice(idx + 1..-1)
+        end
+      end
+    ensure
+      yield line unless line.empty?
+    end
+  end
+end