glimmer-dsl-web 0.3.1 → 0.3.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 162d98e6fa4d8eefcec1f4edb2f5af6c3d5d3a88aaa01704ded825b982aabbd9
-  data.tar.gz: 8c133105ac1cf160658c476771a9b58c0ac351116a1b919cdef37db19bd085e7
+  metadata.gz: fda2e015b57a53d9281d9f04b7c222d8d42bf61bb33d670cb6ddb8cb0893d2c5
+  data.tar.gz: 327db5ff9687b0fb8f5ed96533c9c86dc71ca20876b8db39e28d7b156aed280b
 SHA512:
-  metadata.gz: 5bc70f98db8b2fec83310e789967447663f9d1d7017ad6dd8b1984ce5e520ef835430d5f5b8c885fa92282d63617a58ba42cb30dda6b0212cafd63e3ce378b93
-  data.tar.gz: 75561cba8a7a7d61e71e286e197dbbb80879261715500249ddd565f0833273777039632f2553a1cb5e0e3c4c1258704fc83f73ea7e163c1d4ab64a0af0e2f307
+  metadata.gz: 7b36ba84170c0a90ac89a28218275fa4da16b21972bb298cd59b675fb41670c367aec3524f8582a7181d91f2a723ea36f7d7e6b8e2a1d4e2733b634b7e8e808f
+  data.tar.gz: 4d88b75d775ca693fe50602f7d6b9fd136188f1d88d8d13dee8d7e281c9218a1fc81540e662b1428ff67ac1ee124a015919aec31b2853eb49378ff022003c225

data/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Change Log
 
+## 0.3.2
+
+- Optimize performance (~248% faster) of rendering by changing DSL ordering to avoid component checks at the top
+- Optimize performance of formatting html elements by adding Glimmer DSL shortcut methods
+- Optimize performance of component expressions by indexing component keywords
+
 ## 0.3.1
 
 - Optimize Todo MVC performance for filtering between all, active, and completed (it happens instantly now)

data/README.md

@@ -1,4 +1,4 @@
-# [<img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=85 />](https://github.com/AndyObtiva/glimmer) Glimmer DSL for Web 0.3.1 (Beta)
+# [<img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=85 />](https://github.com/AndyObtiva/glimmer) Glimmer DSL for Web 0.3.2 (Beta)
 ## Ruby in the Browser Web Frontend Framework
 ### Finally, Ruby Developer Productivity, Happiness, and Fun in the Frontend!!!
 [![Gem Version](https://badge.fury.io/rb/glimmer-dsl-web.svg)](http://badge.fury.io/rb/glimmer-dsl-web)
@@ -1333,7 +1333,7 @@ rails new glimmer_app_server
 Add the following to `Gemfile`:
 
 ```
-gem 'glimmer-dsl-web', '~> 0.3.1'
+gem 'glimmer-dsl-web', '~> 0.3.2'
 ```
 
 Run:
@@ -1562,7 +1562,7 @@ Disable the `webpacker` gem line in `Gemfile`:
 Add the following to `Gemfile`:
 
 ```ruby
-gem 'glimmer-dsl-web', '~> 0.3.1'
+gem 'glimmer-dsl-web', '~> 0.3.2'
 ```
 
 Run:

data/VERSION

@@ -1 +1 @@
-0.3.1
+0.3.2

data/glimmer-dsl-web.gemspec

@@ -2,16 +2,16 @@
 # DO NOT EDIT THIS FILE DIRECTLY
 # Instead, edit Jeweler::Tasks in Rakefile, and run 'rake gemspec'
 # -*- encoding: utf-8 -*-
-# stub: glimmer-dsl-web 0.3.1 ruby lib
+# stub: glimmer-dsl-web 0.3.2 ruby lib
 
 Gem::Specification.new do |s|
   s.name = "glimmer-dsl-web".freeze
-  s.version = "0.3.1"
+  s.version = "0.3.2"
 
   s.required_rubygems_version = Gem::Requirement.new(">= 0".freeze) if s.respond_to? :required_rubygems_version=
   s.require_paths = ["lib".freeze]
   s.authors = ["Andy Maleh".freeze]
-  s.date = "2024-07-01"
+  s.date = "2024-07-02"
   s.description = "Glimmer DSL for Web (Ruby in the Browser Web Frontend Framework) enables building Web Frontends using Ruby in the Browser, as per Matz's recommendation in his RubyConf 2022 keynote speech to replace JavaScript with Ruby. It aims at providing the simplest, most intuitive, most straight-forward, and most productive frontend framework in existence. The framework follows the Ruby way (with DSLs and TIMTOWTDI) and the Rails way (Convention over Configuration) in building Isomorphic Ruby on Rails Applications. It provides a Ruby HTML DSL, which uniquely enables writing both structure code and logic code in one language. It supports both Unidirectional (One-Way) Data-Binding (using <=) and Bidirectional (Two-Way) Data-Binding (using <=>). Dynamic rendering (and re-rendering) of HTML content is also supported via Content Data-Binding. Modular design is supported with Glimmer Web Components. And, a Ruby CSS DSL is supported with the included Glimmer DSL for CSS. Many samples are demonstrated in the Rails sample app (there is a very minimal Standalone [No Rails] sample app too). You can finally live in pure Rubyland on the Web in both the frontend and backend with Glimmer DSL for Web! This gem relies on Opal Ruby.".freeze
   s.email = "andy.am@gmail.com".freeze
   s.extra_rdoc_files = [
@@ -93,7 +93,7 @@ Gem::Specification.new do |s|
 
   s.specification_version = 4
 
-  s.add_runtime_dependency(%q<glimmer>.freeze, ["~> 2.7.8"])
+  s.add_runtime_dependency(%q<glimmer>.freeze, ["~> 2.7.9"])
   s.add_runtime_dependency(%q<glimmer-dsl-xml>.freeze, ["~> 1.4.0"])
   s.add_runtime_dependency(%q<glimmer-dsl-css>.freeze, ["~> 1.4.0"])
   s.add_runtime_dependency(%q<opal>.freeze, ["= 1.8.2"])

data/lib/glimmer/data_binding/element_binding.rb

@@ -4,7 +4,6 @@ require 'glimmer/data_binding/observer'
 module Glimmer
   module DataBinding
     class ElementBinding
-      include Glimmer
       include Observable
       include Observer
 
@@ -12,7 +11,7 @@ module Glimmer
       def initialize(element, property, translator = nil)
         @element = element
         @property = property
-        @translator = translator || proc {|value| value}
+        @translator = translator
 
         # TODO implement automatic cleanup upon calling element.remove
         # Alternatively, have this be built into ElementProxy and remove this code
@@ -24,8 +23,9 @@ module Glimmer
       end
       
       def call(value)
-        converted_value = translated_value = @translator.call(value, evaluate_property)
-        @element.send("#{@property}=", converted_value) unless evaluate_property == converted_value
+        evaluated_property_value = evaluate_property
+        converted_value = @translator&.call(value, evaluated_property_value) || value
+        @element.send("#{@property}=", converted_value) unless converted_value == evaluated_property_value
       end
       
       def evaluate_property

data/lib/glimmer/dsl/web/component_expression.rb

@@ -8,7 +8,7 @@ module Glimmer
         include ParentExpression
 
         def can_interpret?(parent, keyword, *args, &block)
-          !!Glimmer::Web::Component.for(keyword)
+          Glimmer::Web::Component.for(keyword)
         end
   
         def interpret(parent, keyword, *args, &block)

data/lib/glimmer/dsl/web/dsl.rb

@@ -40,14 +40,14 @@ module Glimmer
       Engine.add_dynamic_expressions(
        Web,
        %w[
-         component
          listener
-         data_binding
-         property
-         content_data_binding
-         shine_data_binding
          style
+         content_data_binding
+         component
          formatting_element
+         data_binding
+         shine_data_binding
+         property
        ]
       )
     end

data/lib/glimmer/dsl/web/formatting_element_expression.rb

@@ -17,3 +17,14 @@ module Glimmer
     end
   end
 end
+
+module Glimmer
+  # Optimize performance through shortcut methods for all HTML formatting elements that circumvent the DSL chain of responsibility
+  element_expression = Glimmer::DSL::Web::FormattingElementExpression.new
+  Glimmer::Web::FormattingElementProxy::FORMATTING_ELEMENT_KEYWORDS.each do |keyword|
+    Glimmer::DSL::Engine.static_expressions[keyword] ||= Concurrent::Hash.new
+    element_expression_dsl = element_expression.class.dsl
+    Glimmer::DSL::Engine.static_expressions[keyword][element_expression_dsl] = element_expression
+    Glimmer.send(:define_method, keyword, &Glimmer::DSL::Engine::STATIC_EXPRESSION_METHOD_FACTORY.call(keyword))
+  end
+end

data/lib/glimmer/web/component.rb

@@ -119,71 +119,54 @@ module Glimmer
         end
       end
       
+      ADD_COMPONENT_KEYWORDS_UPON_INHERITANCE = proc do
+        class << self
+          def inherited(subclass)
+            Glimmer::Web::Component.add_component_keyword_to_classes_map_for(subclass)
+            subclass.class_eval(&Glimmer::Web::Component::ADD_COMPONENT_KEYWORDS_UPON_INHERITANCE)
+          end
+        end
+      end
+      
       class << self
         def included(klass)
           if !klass.ancestors.include?(GlimmerSupersedable)
             klass.extend(ClassMethods)
             klass.include(Glimmer)
             klass.prepend(GlimmerSupersedable)
-            Glimmer::Web::Component.add_component_namespaces_for(klass)
+            Glimmer::Web::Component.add_component_keyword_to_classes_map_for(klass)
+            klass.class_eval(&Glimmer::Web::Component::ADD_COMPONENT_KEYWORDS_UPON_INHERITANCE)
           end
         end
       
         def for(underscored_component_name)
-          extracted_namespaces = underscored_component_name.
-            to_s.
-            split(/__/).map do |namespace|
-              namespace.camelcase(:upper)
-            end
-          Glimmer::Web::Component.component_namespaces.each do |base|
-            extracted_namespaces.reduce(base) do |result, namespace|
-              if !result.constants.include?(namespace)
-                namespace = result.constants.detect {|c| c.to_s.upcase == namespace.to_s.upcase } || namespace
-              end
-              begin
-                constant = result.const_get(namespace)
-                return constant if constant&.respond_to?(:ancestors) &&
-                                   (
-                                     constant&.ancestors&.to_a.include?(Glimmer::Web::Component) ||
-                                     # TODO checking GlimmerSupersedable as a hack because when a class is loaded twice (like when loading samples
-                                     # by reloading ruby files), it loses its Glimmer::Web::Component ancestor as a bug in Opal
-                                     # but somehow the prepend module remains
-                                     constant&.ancestors&.to_a.include?(GlimmerSupersedable)
-                                   )
-                constant
-              rescue => e
-                # Glimmer::Config.logger.debug {"#{e.message}\n#{e.backtrace.join("\n")}"}
-                result
-              end
-            end
+          component_classes = Glimmer::Web::Component.component_keyword_to_classes_map[underscored_component_name]
+          if component_classes.nil? || component_classes.empty?
+            Glimmer::Config.logger.debug {"#{underscored_component_name} has no Glimmer web component class!" }
+            nil
+          else
+            component_class = component_classes.first
           end
-          raise "#{underscored_component_name} has no Glimmer web component class!"
-        rescue => e
-          Glimmer::Config.logger.debug {e.message}
-          Glimmer::Config.logger.debug {"#{e.message}\n#{e.backtrace.join("\n")}"}
-          nil
         end
  
-        def add_component_namespaces_for(klass)
-          Glimmer::Web::Component.namespaces_for_class(klass).drop(1).each do |namespace|
-            Glimmer::Web::Component.component_namespaces << namespace
+        def add_component_keyword_to_classes_map_for(component_class)
+          keywords_for_class(component_class).each do |keyword|
+            Glimmer::Web::Component.component_keyword_to_classes_map[keyword] ||= []
+            Glimmer::Web::Component.component_keyword_to_classes_map[keyword] << component_class
           end
         end
 
-        def namespaces_for_class(m)
-          return [m] if m.name.nil?
-          namespace_constants = m.name.split(/::/).map(&:to_sym)
-          namespace_constants.reduce([Object]) do |output, namespace_constant|
-            output += [output.last.const_get(namespace_constant)]
-          end[1..-1].uniq.reverse
+        def keywords_for_class(component_class)
+          namespaces = component_class.to_s.split(/::/).map(&:underscore).reverse
+          namespaces.size.times.map { |n| namespaces[0..n].reverse.join('__') }
         end
 
-        def component_namespaces
-          @component_namespaces ||= reset_component_namespaces
+        def component_keyword_to_classes_map
+          @component_keyword_to_classes_map ||= reset_component_keyword_to_classes_map
         end
 
-        def reset_component_namespaces
-          @component_namespaces = Set[Object, Glimmer::Web]
+        def reset_component_keyword_to_classes_map
+          @component_keyword_to_classes_map = {}
         end
         
         def interpretation_stack
@@ -319,6 +302,14 @@ module Glimmer
       def remove
         @markup_root&.remove
       end
+
+      def data_bind(property, model_binding)
+        @markup_root&.data_bind(property, model_binding)
+      end
+      
+      def bind_content(*binding_args, &content_block)
+        @markup_root&.bind_content(*binding_args, &content_block)
+      end
       
       # Returns content block if used as an attribute reader (no args)
       # Otherwise, if a block is passed, it adds it as content to this Glimmer web component

data/lib/glimmer/web/element_proxy.rb

@@ -539,8 +539,8 @@ module Glimmer
       end
       
       def data_bind(property, model_binding)
-        element_binding_translator = value_converters_for_input_type(type)[:model_to_view]
-        element_binding_parameters = [self, property, element_binding_translator]
+        element_binding_read_translator = value_converters_for_input_type(type)&.[](:model_to_view)
+        element_binding_parameters = [self, property, element_binding_read_translator]
         element_binding = DataBinding::ElementBinding.new(*element_binding_parameters)
         #TODO make this options observer dependent and all similar observers in element specific data binding handlers
         element_binding.observe(model_binding)
@@ -552,7 +552,8 @@ module Glimmer
           if listener_keyword
             data_binding_read_listener = lambda do |event|
               view_property_value = send(property)
-              converted_view_property_value = value_converters_for_input_type(type)[:view_to_model].call(view_property_value, model_binding.evaluate_property)
+              element_binding_write_translator = value_converters_for_input_type(type)&.[](:view_to_model)
+              converted_view_property_value = element_binding_write_translator&.call(view_property_value, model_binding.evaluate_property) || view_property_value
               model_binding.call(converted_view_property_value)
             end
             handle_observation_request(listener_keyword, data_binding_read_listener)
@@ -722,7 +723,7 @@ module Glimmer
       end
       
       def value_converters_for_input_type(input_type)
-        input_value_converters[input_type] || {model_to_view: ->(value, old_value) {value}, view_to_model: ->(value, old_value) {value}}
+        input_value_converters[input_type]
       end
       
       def input_value_converters

data/lib/glimmer-dsl-web/samples/regular/todo_mvc/views/edit_todo_input.rb

@@ -5,10 +5,10 @@ class EditTodoInput < TodoInput
   option :todo
   
   markup {
-    input(class: todo_input_class) { |edit_input|
+    input(class: self.class.todo_input_class) { |edit_input|
       style <= [ todo, :editing,
                  on_read: ->(editing) { editing ? '' : 'display: none;' },
-                 after_read: ->(_) { edit_input.focus if todo.editing? }
+                 after_read: -> { edit_input.focus if todo.editing? }
                ]
     
       value <=> [todo, :task]
@@ -25,31 +25,29 @@ class EditTodoInput < TodoInput
       onblur do |event|
         todo.save_editing
       end
-      
-      style {
-        todo_input_styles
-      }
     }
   }
   
-  def todo_input_class
-    'edit-todo'
-  end
-  
-  def todo_input_styles
-    super
-    
-    rule("*:has(> .#{todo_input_class})") {
-      position 'relative'
-    }
+  class << self
+    def todo_input_class
+      'edit-todo'
+    end
     
-    rule(".#{todo_input_class}") {
-      position 'absolute'
-      display 'block'
-      width 'calc(100% - 43px)'
-      padding '12px 16px'
-      margin '0 0 0 43px'
-      top '0'
-    }
+    def todo_input_styles
+      super
+      
+      rule("*:has(> .#{todo_input_class})") {
+        position 'relative'
+      }
+      
+      rule(".#{todo_input_class}") {
+        position 'absolute'
+        display 'block'
+        width 'calc(100% - 43px)'
+        padding '12px 16px'
+        margin '0 0 0 43px'
+        top '0'
+      }
+    end
   end
 end

data/lib/glimmer-dsl-web/samples/regular/todo_mvc/views/new_todo_input.rb

@@ -4,7 +4,7 @@ class NewTodoInput < TodoInput
   option :presenter
   
   markup {
-    input(class: todo_input_class, placeholder: "What needs to be done?", autofocus: "") {
+    input(class: self.class.todo_input_class, placeholder: "What needs to be done?", autofocus: "") {
       value <=> [presenter.new_todo, :task]
     
       onkeyup do |event|
@@ -12,30 +12,32 @@ class NewTodoInput < TodoInput
       end
     
       style {
-        todo_input_styles
+        self.class.todo_input_styles
       }
     }
   }
   
-  def todo_input_class
-    'new-todo'
-  end
-  
-  def todo_input_styles
-    super
-    
-    rule(".#{todo_input_class}") {
-      padding '16px 16px 16px 60px'
-      height '65px'
-      border 'none'
-      background 'rgba(0, 0, 0, 0.003)'
-      box_shadow 'inset 0 -2px 1px rgba(0,0,0,0.03)'
-    }
+  class << self
+    def todo_input_class
+      'new-todo'
+    end
     
-    rule(".#{todo_input_class}::placeholder") {
-      font_style 'italic'
-      font_weight '400'
-      color 'rgba(0, 0, 0, 0.4)'
-    }
+    def todo_input_styles
+      super
+      
+      rule(".#{todo_input_class}") {
+        padding '16px 16px 16px 60px'
+        height '65px'
+        border 'none'
+        background 'rgba(0, 0, 0, 0.003)'
+        box_shadow 'inset 0 -2px 1px rgba(0,0,0,0.03)'
+      }
+      
+      rule(".#{todo_input_class}::placeholder") {
+        font_style 'italic'
+        font_weight '400'
+        color 'rgba(0, 0, 0, 0.4)'
+      }
+    end
   end
 end

data/lib/glimmer-dsl-web/samples/regular/todo_mvc/views/todo_input.rb

@@ -2,29 +2,31 @@
 class TodoInput
   include Glimmer::Web::Component
   
-  def todo_input_class
-    'todo-input'
-  end
-  
-  def todo_input_styles
-    rule(".#{todo_input_class}") {
-      position 'relative'
-      margin '0'
-      width '100%'
-      font_size '24px'
-      font_family 'inherit'
-      font_weight 'inherit'
-      line_height '1.4em'
-      color 'inherit'
-      padding '6px'
-      border '1px solid #999'
-      box_shadow 'inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2)'
-      box_sizing 'border-box'
-      _webkit_font_smoothing 'antialiased'
-    }
+  class << self
+    def todo_input_class
+      'todo-input'
+    end
     
-    rule(".#{todo_input_class}::selection") {
-      background 'red'
-    }
+    def todo_input_styles
+      rule(".#{todo_input_class}") {
+        position 'relative'
+        margin '0'
+        width '100%'
+        font_size '24px'
+        font_family 'inherit'
+        font_weight 'inherit'
+        line_height '1.4em'
+        color 'inherit'
+        padding '6px'
+        border '1px solid #999'
+        box_shadow 'inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2)'
+        box_sizing 'border-box'
+        _webkit_font_smoothing 'antialiased'
+      }
+      
+      rule(".#{todo_input_class}::selection") {
+        background 'red'
+      }
+    end
   end
 end

data/lib/glimmer-dsl-web/samples/regular/todo_mvc/views/todo_list.rb

@@ -46,6 +46,8 @@ class TodoList
   }
   
   def todo_list_styles
+    TodoListItem.todo_list_item_styles
+    
     rule('.main') {
       border_top '1px solid #e6e6e6'
       position 'relative'
@@ -102,7 +104,5 @@ class TodoList
     rule('.todo-list.completed li.active') {
       display 'none'
     }
-    
-    TodoListItem.todo_list_item_styles
   end
 end

data/lib/glimmer-dsl-web/samples/regular/todo_mvc/views/todo_list_item.rb

@@ -55,6 +55,8 @@ class TodoListItem
   end
   
   def self.todo_list_item_styles
+    EditTodoInput.todo_input_styles
+    
     rule('.todo-list li.completed label') {
       color '#949494'
       text_decoration 'line-through'

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: glimmer-dsl-web
 version: !ruby/object:Gem::Version
-  version: 0.3.1
+  version: 0.3.2
 platform: ruby
 authors:
 - Andy Maleh
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2024-07-01 00:00:00.000000000 Z
+date: 2024-07-02 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: glimmer
@@ -16,14 +16,14 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 2.7.8
+        version: 2.7.9
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 2.7.8
+        version: 2.7.9
 - !ruby/object:Gem::Dependency
   name: glimmer-dsl-xml
   requirement: !ruby/object:Gem::Requirement