Upgrade to Pro — share decks privately, control downloads, hide ads and more …

🎉🐱✨or: How I didn’t fix emoji in Chrome

🎉🐱✨or: How I didn’t fix emoji in Chrome

Last year, in the dark days of the web, Chrome couldn’t render emojis. I tried to fix it, failed, and have been making silly emoji related apps ever since.

Monica Dinculescu

December 23, 2015
Tweet

More Decks by Monica Dinculescu

Other Decks in Programming

Transcript

  1. ✨
    @notwaldorf

    View full-size slide

  2. U+26C4
    ☃

    View full-size slide

  3. “\u26C4”
    ☃

    View full-size slide

  4. “‚”.length == 1
    ☃

    View full-size slide


  5. "".charCodeAt(0).toString(16)

    View full-size slide


  6. \uD83D \uDC3C

    View full-size slide


  7. “”.length == 2

    View full-size slide


  8. \ud83d \udc81 \ud83c \udffe

    View full-size slide

  9. )
    “)”.length == 4

    View full-size slide

  10. AppleColorEmoji
    Segoe UI Symbol/Emoji
    Noto

    View full-size slide

  11. AppleColorEmoji
    Segoe UI Symbol/Emoji
    Noto
    panda_face.png lolololololol

    View full-size slide

  12. if you can’t
    fix the problem
    be the problem

    View full-size slide

  13. @muan made emojilib
    {
    "grinning": {
    "keywords": ["face", "smile", "happy", "joy"],
    "char": "",
    "category": "people"
    }
    }

    View full-size slide

  14. . { font-size: 40px; }



    View full-size slide

  15. . { font-size: 40px; }

    function ok() { .
    alert('hi'); . .
    }


    View full-size slide

  16. . { font-size: 40px; }

    function ok() {
    alert(‘ ');
    }



    View full-size slide

  17. . { font-size: 40px; }

    function ok() {
    alert(‘ ');
    }






    View full-size slide

  18. . { font-size: 40px; }

    function ok() {
    alert(‘ ');
    }







    View full-size slide

  19. . { font-size: 40px; }

    function ok() {
    alert(‘ ');
    }






    View full-size slide

  20. . { font-size: 40px; }

    function \u1F43C() {
    alert(‘ ');
    }



    View full-size slide

  21. . { font-size: 40px; }

    function \u1F43C() {
    alert(‘ ');
    }




    View full-size slide

  22. @notwaldorf
    ❤

    View full-size slide