$30 off During Our Annual Pro Sale. View Details »

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

Monica Dinculescu
December 23, 2015
Programming
1
1k

🎉🐱✨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

See All by Monica Dinculescu
How to train your dragon (web standard)
notwaldorf
71
4.8k
Fontastic web performance
notwaldorf
18
3k
What you see is what you deserve: simple visual tools for all!
notwaldorf
5
660
Billions served, lessons learned: a Polymer story
notwaldorf
3
970
An app in 3 days [with an intro to PWA/Polymer]
notwaldorf
2
1.1k
An app in 3 days or: how I learned to stop worrying and love the Polymer toolbox
notwaldorf
3
760
How I didn't fix 📧Ⓜ️💣🚽ℹ️ in Chrome
notwaldorf
2
450
input, i ♥️ you, but you're bringing me down
notwaldorf
8
1.9k
Building web components: lessons, I have them.
notwaldorf
5
1.4k

Other Decks in Programming

See All in Programming
個人開発がおすすめな理由
texmeijin
3
650
fun HelloKMP(): GladToMeetYou
l2hyunwoo
0
150
文系出身・開発未経験エンジニアが 入社から5年間で実践した学習法 〜エンジニアの世界で圧倒的に成長するために〜 (LT) - NIFTY Tech Day 2023
niftycorp
1
150
Backlog APIと生成系AIで考える課題優先度 / Issue prioritisation with Backlog API and generative AI.
seike460
PRO
1
150
エンジニアもUIを作るならユーザーについて知ろう！
ohakutsu
1
130
長年運用されている Web サービスと 通信をするクライアントを Go で作ってみた話
commojun
0
430
DIGGLEの分析基盤アーキテクチャ
zakky21
0
240
Cloudflare Workers は楽しい！
codehex
8
2.3k
スタディストのVue
mtakeda15
0
100
ニジエチューニング2023-12
nijieinfra
0
200
GoにおけるCall Graphを用いた 大規模コードベースの影響調査
ffjlabo
0
350
Software Productivity - Devfest Songdo 2023
veronikapj
0
180

Featured

See All Featured
The Web Native Designer (August 2011)
paulrobertlloyd
78
2.7k
Docker and Python
trallard
32
2.4k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
18
6.4k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
44
12k
Adopting Sorbet at Scale
ufuk
66
8.2k
Building Applications with DynamoDB
mza
87
5.3k
Bash Introduction
62gerente
602
210k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
0
2.7k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
5
750
Writing Fast Ruby
sferik
615
59k
The Invisible Side of Design
smashingmag
291
49k
How GitHub Uses GitHub to Build GitHub
holman
467
280k

Transcript

  1. ✨
    @notwaldorf

    View Slide

  2. View Slide

  3. View Slide

  4. ☃

    View Slide

  5. U+26C4
    ☃

    View Slide

  6. “\u26C4”
    ☃

    View Slide

  7. “‚”.length == 1
    ☃

    View Slide

  8. View Slide


  9. U+1F43C

    View Slide


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

    View Slide


  11. \uD83D \uDC3C

    View Slide


  12. “”.length == 2

    View Slide

  13. )

    View Slide

  14. )
    U+1F43C

    View Slide

  15. U+1F43C

    View Slide


  16. \ud83d \udc81 \ud83c \udffe

    View Slide

  17. )
    “)”.length == 4

    View Slide

  18. View Slide

  19. ok so fonts

    View Slide

  20. AppleColorEmoji
    Segoe UI Symbol/Emoji
    Noto

    View Slide

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

    View Slide

  22. View Slide

  23. View Slide

  24. View Slide

  25. View Slide

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

    View Slide

  27. View Slide

  28. View Slide

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

    View Slide

  30. View Slide

  31. View Slide

  32. View Slide

  33. View Slide

  34. View Slide



  35. View Slide




  36. View Slide

  37. .

    View Slide

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



    View Slide

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

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


    View Slide

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

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



    View Slide

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

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






    View Slide

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

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







    View Slide

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

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






    View Slide

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

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



    View Slide

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

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




    View Slide

  46. @notwaldorf
    ❤

    View Slide