search

samclarke / SCEditor

A lightweight HTML and BBCode WYSIWYG editor
http://www.sceditor.com/
Other
657 stars 187 forks source link

Emoticons: Lazy Loading #403

Open xxluke opened 9 years ago

xxluke commented 9 years ago

Everytime you load a page with the SCEditor, it creates ~31 server-requests for the emoticons. On the most pages with the editor you don't use the editor and if you do, you mostly don't open the smileys dropdown. I suggest that SCEditor should only load the emoticons when you open the dropdown.

An other option instead of lazy loading could be a sprite, but then you should offer a CSS-file with the names and positions of the emoticons, so you can use it in a (BBCode-)parser.

brunoais commented 9 years ago

In which browser does that happen?

xxluke commented 9 years ago

That it loads all emoticons directly? In all browsers I guess. At least in Firefox and IE.

samclarke commented 9 years ago

Currently the editor pre-loads all the emoticons so it can do as you type emoticon conversion. If an emoticon isn't already loaded and the code for it is typed, it will just look like the code has just disappeared until the browser fetches the image.

An option to disable both as you type emoticon conversion and pre-loading could be added though.

I did think about allowing/using sprites but I wasn't sure if anyone would use it as they're a pain to maintain. It could be done though.

asheroto commented 1 year ago

Hi, I know this is old but I'm having a similar issue. I'm using the CDN as described on the front page of the site...

image

It's trying to load /emoticons/blink.png, /emoticons/happy.png, /emoticons/sad.png, etc. I end up getting 30+ 404 errors in console because they don't exist in a locally relative path.

For example, it is trying to load https://mysite.com/emoticons/happy.png but since I'm using the CDN, the emoticons folder doesn't exist under https://mysite.com.

I think that instead of using a relative path for the PNG files in sceditor.min.js, a full URL should be used such as https://cdn.jsdelivr.net/npm/sceditor@3/emoticons/happy.png? Or is this by design?

live627 commented 1 year ago

Try to use the option emoticonsRoot