Juicy / juicy-jsoneditor

Polymer Element that wraps josdejong/jsoneditor and adds two-way binding for edited JSON.
http://juicy.github.io/juicy-jsoneditor/
MIT License
42 stars 12 forks source link

Move javascript imports to new html file to prevent multiple script load #19

Closed krumware closed 6 years ago

krumware commented 6 years ago

Steps to reproduce

Live Demo

https://jsbin.com/ligimo/3/edit?html,output

Expected result

Scripts should only import/execute once upon initial import.

Actual result

Currently the imported scripts will execute for each instance of the component.

Browsers affected

Screenshot

tomalec commented 6 years ago

Could you provide some code samples, live demo?

Even if, I do

<link rel="import" href="bower_components/juicy-jsoneditor/juicy-jsoneditor.html">
<juicy-jsoneditor></juicy-jsoneditor>
<juicy-jsoneditor></juicy-jsoneditor>
<link rel="import" href="bower_components/juicy-jsoneditor/juicy-jsoneditor.html">
<juicy-jsoneditor></juicy-jsoneditor>
<juicy-jsoneditor></juicy-jsoneditor>

bower_components/juicy-jsoneditor/juicy-jsoneditor.html is loaded only once, therefore

"../polymer/polymer.html", 
"../jsoneditor/dist/jsoneditor.min.js", 
"../jsoneditor/dist/jsoneditor-minimalist.min.js", 
"../fast-json-patch/src/json-patch-duplex.js", 
"../jsoneditor/src/js/ace/theme-jsoneditor.js"

are also loaded and executed once.

tomalec commented 6 years ago

The only case that I see when you may get duplicate calls is

<link rel="import" href="bower_components/juicy-jsoneditor/juicy-jsoneditor.html">
<script src="bower_components/jsoneditor/dist/jsoneditor.min.js"></script>

Then jsoneditor.min.js will me loaded and executed twice. However, the change you proposed in https://github.com/Juicy/juicy-jsoneditor/pull/20 still does not solve that.


We could create jsoneditor.min.html:

<script src="../jsoneditor/dist/jsoneditor.min.js"></script>

and in juicy-jsoneditor.html, do <link rel="import" href="jsoneditor.min.html">.

Then we could do

<link rel="import" href="bower_components/juicy-jsoneditor/juicy-jsoneditor.html">
<link rel="import" href="jsoneditor.min.html">

In many many places, what will execute jsoneditor.min.js only once.

However, still the

<link rel="import" href="bower_components/juicy-jsoneditor/juicy-jsoneditor.html">
<script src="bower_components/jsoneditor/dist/jsoneditor.min.js"></script>

will call it twice.

tomalec commented 6 years ago

I'm closing this issue, as I believe I provided valid usage which does not load a thing multiple times. If I miss something, please feel free to reopen.