CINXE.COM
jec.fish
<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="description" content="Articles, experiments, musings by Jecelyn Yeen."><meta property="og:title" content="jec.fish"><meta property="og:description" content="Articles, experiments, musings by Jecelyn Yeen."><meta property="og:type" content="article"><meta property="og:image" content="https://jec.fish/assets/img/root/index.jpg"><meta property="og:image:width" content="1200"><meta property="og:image:height" content="675"><meta name="twitter:title" content="jec.fish"><meta name="twitter:card" content="summary_large_image"><meta name="twitter:site" content="@jecfish"><meta name="twitter:description" content="Articles, experiments, musings by Jecelyn Yeen."><meta name="twitter:image" content="https://jec.fish/assets/img/root/index.jpg"><meta name="twitter:creator" content="@jecfish"><meta name="twitter:widgets:csp" content="on"><link rel="shortcut icon" href="/favicon.ico"><link rel="icon" sizes="16x16 32x32 48x48 64x64" href="/favicon.ico"><link rel="mask-icon" href="https://jec.fish/assets/img/favicons/favicon.svg" color="#4C566A"><link rel="apple-touch-icon" href="https://jec.fish/assets/img/favicons/favicon-120.png" sizes="120x120"><link rel="apple-touch-icon" href="https://jec.fish/assets/img/favicons/favicon-152.png" sizes="152x152"><link rel="apple-touch-icon" href="https://jec.fish/assets/img/favicons/favicon-180.png" sizes="180x180"><meta name="msapplication-TileColor" content="#4C566A"><meta name="msapplication-TileImage" content="https://jec.fish/assets/img/favicons/favicon-144.png"><meta name="msapplication-config" content="browserconfig.xml"><link rel="manifest" href="/web.manifest"><meta name="theme-color" content="#4C566A"><link rel="prefetch" href="https://jec.fish/assets/img/icons/dark.svg" as="image"><link rel="prefetch" href="https://jec.fish/assets/img/icons/light.svg" as="image"><title>jec.fish</title><link rel="preconnect" href="https://www.google-analytics.com"><script async src="https://www.googletagmanager.com/gtag/js?id=G-G36G49KV7T"></script><script>function gtag(){dataLayer.push(arguments)}window.dataLayer=window.dataLayer||[],gtag("js",new Date),gtag("config","G-G36G49KV7T");</script><link id="fontCSS" rel="stylesheet" href="https://jec.fish/assets/css/fonts.css" media="print" onload='this.media="all",window.fontOnload&&window.fontOnload();'><noscript><link rel="stylesheet" href="https://jec.fish/assets/css/fonts.css"></noscript><style> @layer base, component, page; body{background-color:#eceff4;color:#4c566a;font-family:Rubik,sans-serif;font-size:18px;min-height:100vh;min-height:-webkit-fill-available;transition:background-color .3s ease-in-out 0s}body.no-js nav #color-scheme-toggle{display:none}body.dark-mode{background-color:#242933;color:#eceff4}p{line-height:1.6}nav{display:flex;justify-content:space-between;padding:4px 10px;margin-bottom:10px}nav #color-scheme-toggle{background:#d8dee9;padding:0 10px;border-radius:4px;width:16px;height:36px;transition:background-color .3s ease-in-out 0s}.dark-mode nav #color-scheme-toggle{background:rgba(46,52,64,.9)}nav #color-scheme-toggle:hover{background-color:rgba(229,233,240,.75)}.dark-mode nav #color-scheme-toggle:hover{background-color:rgba(76,86,106,.9)}nav #logo{color:#2e3440;font-weight:700;text-decoration:none;padding:10px;border-radius:4px}.dark-mode nav #logo{color:#eceff4} @layer base { main a { color: #194f86; text-decoration: none; border-bottom: 1px solid; } } .dark-mode main a{color:#88c0d0}.pic{display:block;width:100%;position:relative}.pic img{position:absolute;top:0;left:0;width:100%;height:100%}.dark-mode img{filter:grayscale(30%)}.pic{border-radius:10px;animation:fading-light 1.5s infinite;background-color:#fff}.dark-mode .pic{animation:fading-dark 1.5s infinite;background-color:#2e3440}@keyframes fading-light{0%{background-color:#fff}50%{background-color:rgb(255,255,255,.5)}100%{background-color:#fff}}@keyframes fading-dark{0%{background-color:#2e3440}50%{background-color:rgb(46,52,64,.5)}100%{background-color:#2e3440}}</style><style>article{max-width:600px}main strong{color:#194f86;font-weight:400}.dark-mode main strong{color:#88c0d0}.quick-access{display:flex;justify-content:space-between;font-size:smaller;padding:10px 0;font-size:smaller;text-align:center}.quick-access span{padding:0 12px}</style></head><body class="no-js"><script>document.body.classList.toggle("no-js");</script><nav><a id="logo" href="/">jec.fish</a> <img id="color-scheme-toggle" width="36px" src="https://jec.fish/assets/img/icons/dark.svg" alt="toggle dark mode"></nav><style>main{display:grid;justify-items:center;margin-top:10px}main .pic,main img{border-radius:20px}main .pic-wrapper{margin:10px;max-width:90vw}article{border-radius:10px;border:2px solid;padding:0 20px;margin:10px;background:#fff;transition:box-shadow .4s ease-in-out 0s,background-color .4s ease-in-out 0s}.dark-mode article{background:#2e3440}</style><main><div class="pic-wrapper" id="profilePhoto" style="width:200px"><picture class="pic" style="padding-bottom:100%"><img src="https://jec.fish/assets/img/me-light-256.jpg" alt="jecelyn yeen"></picture></div><article style="border:none;background:initial;margin:initial"><div class="quick-access"><span>馃帳 <a href="/deck">/deck</a> </span><span>馃摑 <a href="/blog">/blog</a> </span><span>馃悺 <a href="/fish">/fish</a> </span><span>馃檪 <a href="/chat">/chat</a></span></div></article><article><p></p><p>That's me and my buddy orangutan <a href="https://www.instagram.com/ngmykia/" target="_blank" rel="noopener noreferrer">#ngmykia</a> 鈽濓笍. Both of us are <a href="https://en.wikipedia.org/wiki/Malaysia" target="_blank" rel="noopener noreferrer">Malaysians</a> 馃嚥馃嚲.</p><p>I'm <strong>Jecelyn Yeen</strong>, a developer advocate at Google, working on Chrome DevTools.</p><p>I speak English, Mandarin, Cantonese, Malay, C#, Java, Typescript & of course <strong>JavaScript</strong> 馃槑.</p><p>Find me on: <a href="/blog/conf-2023" target="_blank" rel="noopener noreferrer">Live at events</a>, <a href="https://indieweb.social/@jecfish" target="_blank" rel="noopener noreferrer">Mastodon</a>, <a href="https://twitter.com/jecfish" target="_blank" rel="noopener noreferrer">Twitter</a>, <a href="https://www.linkedin.com/in/jecfish" target="_blank" rel="noopener noreferrer">LinkedIn</a>, <a href="https://www.facebook.com/jecfish" target="_blank" rel="noopener noreferrer">Facebook</a>, <a href="https://github.com/jecfish" target="_blank" rel="noopener noreferrer">Github</a>. You may watch this video of me on <a href="https://youtu.be/kEieXe-3DGU" target="_blank" rel="noopener noreferrer">Youtube</a> too... and <a href="https://www.youtube.com/playlist?list=PLNYkxOF6rcIBDSojZWBv4QJNoT4GNYzQD" target="_blank" rel="noopener noreferrer">many more</a>.</p></article><article><p>My favourite pastime away from work involves <strong>scuba diving</strong>, staying in remote islands without / with limited WiFi. 馃彎</p><p>I love <strong>reading books</strong> too. Call me old school <small>( maybe not 馃槅)</small> but I prefer printed books over e-books because I can smell them.</p></article><article></article><small style="text-align:center">Hand-crafted with love by Jecelyn Yeen 漏 <a href="/licenses" style="font-weight:400">Licenses</a> | <a href="/index.xml" style="font-weight:400">RSS Feed</a></small></main><script>window.addEventListener("load",()=>{"serviceWorker"in navigator&&navigator.serviceWorker.register("sw.js")});{const e=document.querySelector("#color-scheme-toggle"),r="dark",o="light",t="colorSchemeChanged";e.addEventListener(t,e=>{const t=e.detail===r,c=document.querySelector("#profilePhoto .pic img"),i=[r,o];t&&i.reverse(),c.src=c.src.replace(i[0],i[1])})}</script><script>{const e=document.querySelector("body"),c=document.querySelector("#color-scheme-toggle"),t=document.querySelector("#prism-css"),r="dark",o="light",l="colorSchemeChanged";function toggleColorScheme(){const a=e.classList.toggle("dark-mode"),s=a?r:o;localStorage.setItem("jec.color-scheme",s),a?(c.src=c.src.replace(r,o),c.alt=c.alt.replace(r,o),t&&(t.href=t.href.replace(o,r))):(c.src=c.src.replace(o,r),c.alt=c.alt.replace(o,r),t&&(t.href=t.href.replace(r,o))),c.dispatchEvent(new CustomEvent(l,{detail:s}))}c.addEventListener("click",()=>toggleColorScheme());{function init(){let e=localStorage.getItem("jec.color-scheme");e=!e&&matchMedia&&matchMedia("(prefers-color-scheme: dark)").matches?"dark":e||"light","dark"===e&&toggleColorScheme()}init()}}</script></body></html>