Hi HN, this is my first real close-to-completion project.
It just about fits my needs, but I think the Javascript can be improved on, and I definitely need some help with the CSS. Would love for someone to have a quick look at it and maybe give me some pointers.
Looks like a cool script! The problem though is that by including all the images inside the CSS you're forcing the client to download 3.62MB of icons, even if only a few are used.
You could avoid this by converting the emoticon text to <img> tags, or by conditionally inlining the CSS for the background-image. I'd personally prefer the <img> solution, though it's not as clean as the base64 solution as the images will need to be hosted as well.
Could another possible solution be to use a font file instead?
I do know that the filesize is pretty big (and only gets bigger as I add more emoji icons into it), so I was thinking of maybe setting some build options, to include only specific sets of icons.
3 comments
[ 3.8 ms ] story [ 19.2 ms ] threadIt just about fits my needs, but I think the Javascript can be improved on, and I definitely need some help with the CSS. Would love for someone to have a quick look at it and maybe give me some pointers.
Thanks!
You could avoid this by converting the emoticon text to <img> tags, or by conditionally inlining the CSS for the background-image. I'd personally prefer the <img> solution, though it's not as clean as the base64 solution as the images will need to be hosted as well.