将 Hyperstack components/models 限制为仅某些特定页面工作所必需的那些？

Question

当您访问 Hyperstack 中的某个页面时，app/hyperstack/models 目录中的每个模型都会被包含并发送到浏览器。为了安全和性能起见，是否可以（自动或通过某些指令）仅加载模型所需的代码，而不加载组件使用的代码？

也许这可以通过类似于策略适用于数据的方式来完成？所以我想问 Hyperstack 中是否有某种策略限制发送到浏览器的代码？

Answer 1

没有很好的自动方式来执行此操作，但实现此操作并不太费力。您必须为每个页面上使用的任何内容（opal、hyperstack、react 等）创建一个共享 JS 文件，然后为每个 Page/Single 页面应用程序创建一个单独的 JS 文件。

这是一个非常基本的例子：

Application.js

# app/assets/javascripts/application.rb

require 'webpack/client_only'
require 'components/shared'

共享JS文件

# app/hyperstack/components/shared.rb

require 'opal'

require 'webpack/client_and_server'
require 'hyperstack-config'

# etc...

用户仪表板 SPA：

# app/hyperstack/components/user_dashboard.rb

# Require shared models
require './models/user'

# Require shared components
require_tree './components/user_dashboard'

待办事项列表 SPA：

# app/hyperstack/components/todo_list.rb

# Require shared models
require './models/todo'
require './models/user'

# Require shared components
require_tree './components/todo_list'

用户仪表板HTML布局

# app/views/layouts/user_dashboard.html.erb

<%= javascript_include_tag('application.js') %>
<%= javascript_include_tag('components/todo_list.js') %>

待办事项列表HTML布局

# app/views/layouts/todo_list.html.erb

<%= javascript_include_tag('application.js') %>
<%= javascript_include_tag('components/todo_list.js') %>

为了使它更加动态，我还做了一些事情，即在控制器中创建一个辅助方法来定义要基于控制器使用的单独 JS 文件的名称。如果需要，这还允许您仅使用一个布局文件：

# app/controllers/application_controller.rb

class ApplicationController
  helper_method :spa_asset

  def spa_asset
    params[:controller]
  end
end

# app/views/layouts/application.html.erb

<%= javascript_include_tag('application.js') %>
<%= javascript_include_tag(spa_asset) %>

然后继承controller如果文件名与controller名称不匹配可以重新定义：

# app/controllers/foo_controller.rb

class FooController
  def spa_asset
    'todo_list'
  end
end

希望对您有所帮助！

将 Hyperstack components/models 限制为仅某些特定页面工作所必需的那些？

Restrict Hyperstack components/models to only those necessary for some specific page to work?

ruby

hyperstack