Inline dependencies?

[mmontone]

What do you think of support for inline dependencies? Provide the source for dependencies directly in the dependency, no need to link to url/files.

For example, I'm using this:

(DEFMETHOD REBLOCKS/DEPENDENCIES:GET-DEPENDENCIES ((WIDGET LIST-PRESENTATION))
   (APPEND
    (LIST
     (MAKE-INSTANCE 'INLINE-DEPENDENCY :NAME "list-presentation" :TYPE :CSS
                    :SOURCE ".list-presentation li:hover .item-actions {
                             float:right;
                             display:block !important;
                        }"))
    (CALL-NEXT-METHOD)))

And this is my implementation:

(defclass inline-dependency (reblocks/dependencies:dependency)
  ((name :initarg :name
         :reader dependency-name
         :initform (error "Provide a name for the dependency")
         :type string)
   (source :initarg :source
           :reader dependency-source
           :initform (error "Provide dependency source")
           :type string))
  (:default-initargs
   :type (error "Provide dependency type.")))

(defmethod reblocks/dependencies:get-url ((dependency inline-dependency))
  ;; Use name as "url"
  (dependency-name dependency))

(defmethod reblocks/dependencies:render-in-head ((dependency inline-dependency))
  (case (reblocks/dependencies:get-type dependency)
    ;; Javascript
    (:js
     (with-html ()
       (:script :type "text/javascript"
                (dependency-source dependency))))
    ;; CSS
    (:css
     (with-html ()
       (:style
        (dependency-source dependency))))))

Perhaps SOURCE-DEPENDENCY would be a better name ...

[mmontone]

Here is complete implementation. Works for ajax requests too. Needs some extra javascript.

;; ** Inline dependencies

;; Require this javascript code:

;; function insert_script(script_name, script_source) {
;;     if (!window.loadedDependencies.includes(script_name)) {
;;         var html_doc = document.getElementsByTagName('head').item(0);
;;         var js = document.createElement('script');
;;         js.setAttribute('language', 'javascript');
;;         js.setAttribute('type', 'text/javascript');
;;         js.textContent = script_source;
;;         html_doc.appendChild(js);
;;         window.loadedDependencies.push(script_name);
;;     }
;;     return false;
;; }
;; window.loadedStyles = [];
;; function insert_style(name, source) {
;;     if (!window.loadedStyles.includes(name)) {
;;         var html_doc = document.getElementsByTagName('head').item(0);
;;         var css = document.createElement('style');
;;         css.textContent = source;
;;         html_doc.appendChild(css);
;;         window.loadedStyles.push(name);
;;     }
;;     return false;
;; }

(defclass inline-dependency (reblocks/dependencies:dependency)
  ((name :initarg :name
         :reader dependency-name
         :initform (error "Provide a name for the dependency")
         :type string)
   (source :initarg :source
           :reader dependency-source
           :initform (error "Provide dependency source")
           :type string))
  (:default-initargs
   :type (error "Provide dependency type.")))

(defmethod reblocks/dependencies:get-url ((dependency inline-dependency))
  ;; Use name as "url"
  (dependency-name dependency))

(defmethod reblocks/dependencies:render-in-head ((dependency inline-dependency))
  (case (reblocks/dependencies:get-type dependency)
    ;; Javascript
    (:js
     (with-html ()
       (:script :type "text/javascript"
                (dependency-source dependency))))
    ;; CSS
    (:css
     (with-html ()
       (:style
        (dependency-source dependency))))))

(defmethod reblocks/dependencies:render-in-ajax-response ((dependency inline-dependency))
  (case (reblocks/dependencies:get-type dependency)
    (:js
     (let ((script (ps:ps* `(insert_script ,(dependency-name dependency) ,(dependency-source dependency)))))
       (log:debug "Rendering js dependency in ajax response" dependency)
       (reblocks/response:send-script script :before-load)))
    (:css
     (let ((script (ps:ps* `(insert_style ,(dependency-name dependency) ,(dependency-source dependency)))))
       (log:debug "Rendering css dependency in ajax response" dependency)
       (reblocks/response:send-script script :before-load)))))

[svetlyak40wt]

That is an interesting approach.

I've already has these two libraries for similar purpose, except they are not inject:

• https://40ants.com/reblocks-lass/
• https://40ants.com/reblocks-parenscript/

But they are served as files instead of embedding them to the HTML.

However, I see potential in your idea - probably we could make this feature of embedding inline css/js code in the initial page a Reblocks feature. I mean, to make an inline-dependency class a part of Reblocks, but leave LASS/Parenscript subclasses in the separate libraries.

It would be cool to make it configurable during at the application initialization stage if we want to inline css/js or to serve them as a separate files.

What do you think?

[mmontone]

That is an interesting approach.

I've already has these two libraries for similar purpose, except they are not inject:

* https://40ants.com/reblocks-lass/

* https://40ants.com/reblocks-parenscript/

The cool thing about inline dependencies is that the user is free to generate the source however he wants, either passing a string, compiling with parenscript, or some css sexp->string library.

But they are served as files instead of embedding them to the HTML.

However, I see potential in your idea - probably we could make this feature of embedding inline css/js code in the initial page a Reblocks feature. I mean, to make an inline-dependency class a part of Reblocks, but leave LASS/Parenscript subclasses in the separate libraries.

Yes, I'm not proposing parenscript or lass. Only generic string source.

It would be cool to make it configurable during at the application initialization stage if we want to inline css/js or to serve them as a separate files.

What do you think?

I don't understand what is involved in initialization, and why you would want to modify that. What is missing from my implementation from your point of view?

[mmontone]

I understand what you are pointing out. I will have a look ..