[{"data":1,"prerenderedAt":21},["ShallowReactive",2],{"$fYO8rYpUdD1uWEIscJ18e86LJotYu__gGGw9W8mcZKoY":3},{"issue":4},{"analytics":5,"html":11,"issueId":12,"issueNumber":13,"ogImage":14,"publishedAt":17,"title":18,"url":19,"version":20},{"clickRate":6,"clicks":7,"openRate":8,"sent":9,"views":10},30,327,60,1104,667,"\u003C!doctype html>\n\u003Chtml xmlns=\"http://www.w3.org/1999/xhtml\" xmlns:v=\"urn:schemas-microsoft-com:vml\" xmlns:o=\"urn:schemas-microsoft-com:office:office\">\n \u003Chead>\n \u003Ctitle>\n \n \u003C/title>\n \u003C!--[if !mso]>\u003C!-->\n \u003Cmeta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n \u003C!--\u003C![endif]-->\n \u003Cmeta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\">\n \u003Cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n \u003Cstyle type=\"text/css\">\n #outlook a { padding:0; }\n body { margin:0;padding:0;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%; }\n table, td { border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt; }\n img { border:0;height:auto;line-height:100%; outline:none;text-decoration:none;-ms-interpolation-mode:bicubic; }\n p { display:block;margin:13px 0; }\n \u003C/style>\n \u003C!--[if mso]>\n \u003Cnoscript>\n \u003Cxml>\n \u003Co:OfficeDocumentSettings>\n \u003Co:AllowPNG/>\n \u003Co:PixelsPerInch>96\u003C/o:PixelsPerInch>\n \u003C/o:OfficeDocumentSettings>\n \u003C/xml>\n \u003C/noscript>\n \u003C![endif]-->\n \u003C!--[if lte mso 11]>\n \u003Cstyle type=\"text/css\">\n .mj-outlook-group-fix { width:100% !important; }\n \u003C/style>\n \u003C![endif]-->\n \n \u003C!--[if !mso]>\u003C!-->\n \u003Clink href=\"https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap\" rel=\"stylesheet\" type=\"text/css\">\n \u003Cstyle type=\"text/css\">\n @import url(https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap);\n \u003C/style>\n \u003C!--\u003C![endif]-->\n\n \n \n \u003Cstyle type=\"text/css\">\n @media only screen and (min-width:480px) {\n .mj-column-per-100 { width:100% !important; max-width: 100%; }\n.mj-column-px-200 { width:200px !important; max-width: 200px; }\n.mj-column-per-15 { width:15% !important; max-width: 15%; }\n.mj-column-per-85 { width:85% !important; max-width: 85%; }\n.mj-column-per-50 { width:50% !important; max-width: 50%; }\n.mj-column-per-20 { width:20% !important; max-width: 20%; }\n.mj-column-per-80 { width:80% !important; max-width: 80%; }\n }\n \u003C/style>\n \u003Cstyle media=\"screen and (min-width:480px)\">\n .moz-text-html .mj-column-per-100 { width:100% !important; max-width: 100%; }\n.moz-text-html .mj-column-px-200 { width:200px !important; max-width: 200px; }\n.moz-text-html .mj-column-per-15 { width:15% !important; max-width: 15%; }\n.moz-text-html .mj-column-per-85 { width:85% !important; max-width: 85%; }\n.moz-text-html .mj-column-per-50 { width:50% !important; max-width: 50%; }\n.moz-text-html .mj-column-per-20 { width:20% !important; max-width: 20%; }\n.moz-text-html .mj-column-per-80 { width:80% !important; max-width: 80%; }\n \u003C/style>\n \n \n \u003Cstyle type=\"text/css\">\n \n \n\n @media only screen and (max-width:480px) {\n table.mj-full-width-mobile { width: 100% !important; }\n td.mj-full-width-mobile { width: auto !important; }\n }\n \n \u003C/style>\n \u003Cstyle type=\"text/css\">\n \n \u003C/style>\n \n \u003C/head>\n \u003Cbody style=\"word-spacing:normal;background-color:#FFFFFF;\">\n \n \n \u003Cdiv style=\"background-color:#FFFFFF;\">\n \n \n \u003C!--[if mso | IE]>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">FOLLOW_UP_PLACEHOLDER\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:12px;font-weight:300;line-height:24px;text-align:center;color:#616161;\">\u003Cspan style=\"color:#bdbdbd;line-height:9px;\">\u003Ca href=\"https://weekly-vue.news/issues/86\" target=\"_blank\" style=\"text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: black;\">View and discuss online\u003C/a>, \u003C/span>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:200px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-px-200 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"border-collapse:collapse;border-spacing:0px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"width:150px;\">\n \n \u003Ca href=\"https://weekly-vue.news?ref=newsletter\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n \n \u003Cimg height=\"auto\" src=\"https://mokkapps.twic.pics/weekly-vue.news/logo-with-text.png?twic=v1/cover=200\" style=\"border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;font-size:13px;\" width=\"150\">\n \n \u003C/a>\n \n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"\" >\u003C![endif]-->\n \n \u003Cdiv style=\"height:25px;line-height:25px;\"> \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;padding-top:0px;padding-bottom:0px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:18px;font-weight:700;line-height:24px;text-align:left;color:#616161;\">Weekly Vue News #86\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:5px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:22px;font-weight:700;line-height:24px;text-align:left;color:#616161;\">\u003Cp>When to Use Render Function\u003C/p>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cp style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:100%;\">\n \u003C/p>\n \n \u003C!--[if mso | IE]>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:550px;\" role=\"presentation\" width=\"550px\" >\u003Ctr>\u003Ctd style=\"height:0;line-height:0;\">  \n\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cp>Hi πŸ‘‹\u003C/p>\u003Cp>Firstly, I would like to congratulate the recent Vue.js Live 2023 ticket raffle winners and express my gratitude to all who participated. Your support and enthusiasm are much appreciated, and I hope to continue offering engaging events and opportunities in the future.\u003C/p>\u003Cp>In other news, I'll soon start preparing my talk for Vue.js Live 2023 conference.\u003C/p>\u003Cp>Stay tuned for more updates, and thank you for being a valued part of our community.\u003C/p>\u003Cp>Have a lovely week β˜€οΈ\u003C/p>\u003Chr>\u003Cp>To support me:\u003C/p>\u003Cul>\u003Cli>😘 \u003Cstrong>Recommend the newsletter to your friends\u003C/strong>: it really helps!\u003C/li>\u003Cli>πŸ’Έ \u003Ca href=\"https://weekly-vue.news/sponsor\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">Sponsor\u003C/a> the newsletter\u003C/li>\u003Cli>🧡 \u003Ca href=\"https://twitter.com/weekly_vue_news\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">Retweet the latest Twitter thread\u003C/a>\u003C/li>\u003Cli>πŸ“¨ Reply to this \u003Ca href=\"mailto:info@weekly-vue.news\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">email\u003C/a>: feedback is welcome\u003C/li>\u003C/ul>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:20px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:22px;font-weight:700;line-height:24px;text-align:left;color:#3fb983;\">Vue Tip: When to Use Render Function\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cp>There are very few cases where you should use a \u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fvuejs.org%2Fguide%2Fextras%2Frender-function.html&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">render function\u003C/a>\u003C/mj-text> instead of regular templates to create components in Vue.js.\u003C/p>\u003Cp>\u003Cstrong>Avoiding rendering functions results in code that is much easier to read and more accessible to other developers.\u003C/strong>\u003C/p>\u003Cp>I think that render functions are a difficult-to-read mix of HTML and JavaScript.\u003C/p>\u003Cp>Avoiding render functions is also the recommended approach in the \u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fvuejs.org%2Fguide%2Fextras%2Frender-function.html&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">Vue documentation\u003C/a>\u003C/mj-text>:\u003C/p>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"\" >\u003C![endif]-->\n \n \u003Cdiv style=\"height:10px;line-height:10px;\"> \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" bgcolor=\"#007BFF19\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"background:#007BFF19;background-color:#007BFF19;margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#007BFF19;background-color:#007BFF19;width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#007bff;\">\u003Cp>Vue recommends using templates to build applications in the vast majority of cases. However, there are situations where we need the full programmatic power of JavaScript. That's where we can use the render function.\u003C/p>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"\" >\u003C![endif]-->\n \n \u003Cdiv style=\"height:20px;line-height:20px;\"> \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ch3 id=\"code-examples\">Code Examples\u003C/h3>\u003Cp>Let's compare a simple example using the \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\"><template>\u003C/code> tag and render function. First the regular Vue component code:\u003C/p>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cdiv class=\"code\">\u003Cpre tabindex=\"1\" class=\"shiki \" style=\"background-color: #1E1E1E\">\u003Ccode class=\"undefined\" style=\"undefined\">\u003Cdiv style=\"padding: 10px\">\u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" bgcolor=\"#1e1e1e\" style=\"border-collapse:separate; border-spacing: 0 0.2em;\">\u003Ctbody>\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">template\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">div\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">class\u003C/span>\u003Cspan style=\"color: #D4D4D4\">=\u003C/span>\u003Cspan style=\"color: #CE9178\">\"wrapper\"\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">p\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">class\u003C/span>\u003Cspan style=\"color: #D4D4D4\">=\u003C/span>\u003Cspan style=\"color: #CE9178\">\"any-class\"\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003Cspan style=\"color: #D4D4D4\">Lorem Ipsum\u003C/span>\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">p\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">div\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">template\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n \u003C/tr>\u003C/tbody>\u003C/table>\u003C/div>\u003C/code>\u003C/pre>\u003C/div>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cp>And this would be the equivalent using render function:\u003C/p>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cdiv class=\"code\">\u003Cpre tabindex=\"1\" class=\"shiki \" style=\"background-color: #1E1E1E\">\u003Ccode class=\"undefined\" style=\"undefined\">\u003Cdiv style=\"padding: 10px\">\u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" bgcolor=\"#1e1e1e\" style=\"border-collapse:separate; border-spacing: 0 0.2em;\">\u003Ctbody>\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">script\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">setup\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #C586C0\">import\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> { \u003C/span>\u003Cspan style=\"color: #9CDCFE\">h\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> } \u003C/span>\u003Cspan style=\"color: #C586C0\">from\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'vue'\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #569CD6\">const\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #4FC1FF\">render\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> = \u003C/span>\u003Cspan style=\"color: #DCDCAA\">h\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'div'\u003C/span>\u003Cspan style=\"color: #D4D4D4\">, \u003C/span>\u003Cspan style=\"color: #6A9955\">// type\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> { \u003C/span>\u003Cspan style=\"color: #9CDCFE\">class:\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'wrapper'\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> }, \u003C/span>\u003Cspan style=\"color: #6A9955\">// props\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> [\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #DCDCAA\">h\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'div'\u003C/span>\u003Cspan style=\"color: #D4D4D4\">,\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> {\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">class:\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'any-class'\u003C/span>\u003Cspan style=\"color: #D4D4D4\">,\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">innerHTML:\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'Lorem Ipsum'\u003C/span>\u003Cspan style=\"color: #D4D4D4\">,\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> },\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> []\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> ),\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> ] \u003C/span>\u003Cspan style=\"color: #6A9955\">// children\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">)\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">script\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">template\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #F44747\">render\u003C/span>\u003Cspan style=\"color: #808080\"> />\u003C/span>\u003C/td>\n \u003C/tr>\n\u003Ctr class=\"line \">\n \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">template\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n \u003C/tr>\u003C/tbody>\u003C/table>\u003C/div>\u003C/code>\u003C/pre>\u003C/div>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cp>\u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fsfc.vuejs.org%2F%23eNqNUk1vwjAM%2FStWLmUSNIfdqg5p2mWTmLTDboRDVwwtIk7kBBCq%2Bt%2FnFNi30G7xs%2F3k9146de99vt%2BhKlQZam59hIBx56eGWusdR%2BiggR5W7CxkMpgZMlQ7ChEYaYkMd9CMDAFky3afjUFriEePCemg3lYhFJAduPIeOYN%2BGPDsfEgT82Z0Xvucreg4Gd6CtkTIj6%2FPM8FnjtHCkw87O%2FDMFzeLRFY37XYptxi6MVTqkwq5X4qI1m%2BriFIBlOd7tVSl%2FmipsTopndjK55vgSLzo0oI5N4JRBQxIwsSDVBvVxOhDoXVY1cnBTcgdr7W8ct5RbC3mGOzkjd0hIAuxUeMvHFrAPfLkdBTyNc4fo794E21vqBcpD87%2BmSdsK1rfGZXEiP5k25DhkIREuMRVS%2FiSqrIDqiwWECK3tIZ%2BOhJjL6GfmvIj%2FrFzLYzmdvqQghsuEHsvvH2ppTXY%2Fy2l%2Fh1Ys%2BiV&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">SFC Playground\u003C/a>\u003C/mj-text>\u003C/p>\u003Ch3 id=\"render-function-scenarios\">Render Function Scenarios\u003C/h3>\u003Cp>Render functions are required when there is a necessity for harnessing the complete programmatic capabilities of JavaScript, such as gaining greater authority over how an application is rendered. Vue libraries development greatly benefits from render functions, which are also employed by a specific subset of developers.\u003C/p>\u003Cp>\u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fvuedose.tips%2Fwhen-to-use-a-vue-render-function&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">This article\u003C/a>\u003C/mj-text> explains a few render functions use-cases.\u003C/p>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:20px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:22px;font-weight:700;line-height:24px;text-align:left;color:#3fb983;\">Curated Vue Content\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fmasteringnuxt.com%2Fblog%2Flogging-in-and-logging-out&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-830d90e8>πŸ“• Auth in Nuxt 3: Logging in and Logging Out\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-830d90e8>\u003Cp data-v-830d90e8-s>πŸ‘‰πŸ» Michael explains how to use Supabase and Github to log users in and out of a Nuxt 3 application.\u003C/p>\u003C/span>\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fmasteringnuxt.com%2Fblog%2Flogging-in-and-logging-out&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-830d90e8>masteringnuxt.com\u003C/a>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fvueschool.io%2Farticles%2Fvuejs-tutorials%2Fcomposing-layouts-with-vue-router%2F&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-830d90e8>πŸ“• Composing Layouts with Vue Router\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-830d90e8>\u003Ctable data-v-830d90e8-s>\n \u003Ctbody>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» We all know that Vue Router can be used to map routes to page components.\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» Daniel shows how you can also use it to compose page layouts.\u003C/td>\u003C/tr>\u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fvueschool.io%2Farticles%2Fvuejs-tutorials%2Fcomposing-layouts-with-vue-router%2F&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-830d90e8>vueschool.io\u003C/a>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3D8h4PgNvF-oM&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-830d90e8>πŸ“Ή Rapid Fullstack Development with Nuxt 3 and tRPC\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-830d90e8>\u003Cp data-v-830d90e8-s>πŸ‘‰πŸ» tRPC is a library that makes it easy to build end-to-end typesafe APIs without code generation by leveraging the power of modern TypeScript.\u003C/p>\u003C/span>\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3D8h4PgNvF-oM&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-830d90e8>www.youtube.com\u003C/a>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3Dn1b2s5khvaI&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-830d90e8>πŸ“Ή I Tried Nuxt 3 and Vue.js: My Top 3 DX Loves\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-830d90e8>\u003Cp data-v-830d90e8-s>πŸ‘‰πŸ» Tejas learned Nuxt & Vue from Daniel Croe over a ~2 hour livestream.\u003C/p>\u003C/span>\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3Dn1b2s5khvaI&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-830d90e8>www.youtube.com\u003C/a>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fgithub.com%2Fopen-source-labs%2FPreVue&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-830d90e8>πŸ› οΈ PreVue\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-830d90e8>\u003Ctable data-v-830d90e8-s>\n \u003Ctbody>\u003Ctr>\u003Ctd>PreVue allows users to:\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» Create components and preview their code\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» Set up different routes and views\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» Establish parent-child component relationships\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» View application hierarchy in tree format\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» Export the component architecture\u003C/td>\u003C/tr>\u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fgithub.com%2Fopen-source-labs%2FPreVue&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-830d90e8>github.com\u003C/a>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:20px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:22px;font-weight:700;line-height:24px;text-align:left;color:#3fb983;\">Quote of the week\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"border-collapse:collapse;border-spacing:0px;\" class=\"mj-full-width-mobile\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"width:550px;\" class=\"mj-full-width-mobile\">\n \n \u003Cimg height=\"auto\" src=\"https://mokkapps.twic.pics/weekly-vue.news/quotes/quote-problem-well-stated.png\" style=\"border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;font-size:13px;\" title=\"Quote of the week\" width=\"550\">\n \n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:20px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:22px;font-weight:700;line-height:24px;text-align:left;color:#3fb983;\">Curated Web Development Content\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fwww.workingsoftware.dev%2Ffrontend-rendering-techniques%2F&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-830d90e8>πŸ“• Which web frontend architecture fits best?\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-830d90e8>\u003Cp data-v-830d90e8-s>πŸ‘‰πŸ» Technical article where Patrick creates a guide on how to find the right web frontend architecture that fits your specific quality goals.\u003C/p>\u003C/span>\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fwww.workingsoftware.dev%2Ffrontend-rendering-techniques%2F&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-830d90e8>www.workingsoftware.dev\u003C/a>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fdevblogs.microsoft.com%2Ftypescript%2Ftypescripts-migration-to-modules%2F&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-830d90e8>πŸ“• TypeScript’s Migration to Modules\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-830d90e8>\u003Ctable data-v-830d90e8-s>\n \u003Ctbody>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» TypeScript has restructured its codebase to use ES modules.\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» It results in smaller package sizes, quicker build times, and little disruption to end users.\u003C/td>\u003C/tr>\u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fdevblogs.microsoft.com%2Ftypescript%2Ftypescripts-migration-to-modules%2F&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-830d90e8>devblogs.microsoft.com\u003C/a>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fandy-bell.co.uk%2Fmy-favourite-3-lines-of-css%2F&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-830d90e8>πŸ“• My favourite 3 lines of CSS\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-830d90e8>\u003Cp data-v-830d90e8-s>πŸ‘‰πŸ» β€œThe main reason I’ve written this post though, is to send people to it when they ask why I use .flow or use margin, but also, I hope you’ve seen how damn powerful CSS Custom Properties are.”\u003C/p>\u003C/span>\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fandy-bell.co.uk%2Fmy-favourite-3-lines-of-css%2F&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-830d90e8>andy-bell.co.uk\u003C/a>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fmodernfontstacks.com%2F&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-830d90e8>πŸ› οΈ Modern Font Stacks\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-830d90e8>\u003Ctable data-v-830d90e8-s>\n \u003Ctbody>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» Features a system font stack for every modern OS organized by typeface classification.\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» The fonts are fast and do not require downloading, layout shifts, or flashes.\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» They can be easily previewed with customizations.\u003C/td>\u003C/tr>\u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fmodernfontstacks.com%2F&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-830d90e8>modernfontstacks.com\u003C/a>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fgithub.com%2Funjs%2Fconsola&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-830d90e8>πŸ› οΈ consola\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-830d90e8>\u003Ctable data-v-830d90e8-s>\n \u003Ctbody>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» Elegant Console Logger for Node.js and Browser\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» Easy to use\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» Fancy output with fallback for minimal environments\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» Pluggable reporters\u003C/td>\u003C/tr>\u003Ctr>\u003Ctd>πŸ‘‰πŸ» and more...\u003C/td>\u003C/tr>\u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://weekly-vue.news/api/track-click?linkUrl=https%3A%2F%2Fgithub.com%2Funjs%2Fconsola&token=VERIFICATION_TOKEN_PLACEHOLDER&issueId=ISSUE_ID_PLACEHOLDER\" target=\"_blank\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-830d90e8>github.com\u003C/a>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cp style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:100%;\">\n \u003C/p>\n \n \u003C!--[if mso | IE]>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:550px;\" role=\"presentation\" width=\"550px\" >\u003Ctr>\u003Ctd style=\"height:0;line-height:0;\">  \n\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-style:italic;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cspan>Comments? Join the discussion about this issue \u003C/span>\u003Ca href=\"https://weekly-vue.news/issues/86\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">here\u003C/a>.\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cp style=\"margin:5px 0;\">Until next week,\u003C/p>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:90px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-15 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;padding-right:0px;padding-left:25px;word-break:break-word;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"border-collapse:collapse;border-spacing:0px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"width:65px;\">\n \n \u003Ca href=\"https://mokkapps.de?ref=newsletter\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n \n \u003Cimg height=\"auto\" src=\"https://mokkapps.twic.pics/weekly-vue.news/profile-pic.png?twic=v1/cover=80\" style=\"border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;font-size:13px;\" width=\"65\">\n \n \u003C/a>\n \n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003Ctd class=\"\" style=\"vertical-align:top;width:510px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-85 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd vertical-align=\"top\" style=\"font-size:0px;word-break:break-word;\">\n \n \u003Cdiv class=\"mj-column-per-50 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://mokkapps.de?ref=newsletter\" style=\"text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: black;\">Michael Hoffmann\u003C/a> (Curator)\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003Ctr>\n \u003Ctd vertical-align=\"top\" style=\"font-size:0px;word-break:break-word;\">\n \n \u003Cdiv class=\"mj-column-per-50 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;padding-left:22px;word-break:break-word;\">\n \n \n \u003C!--[if mso | IE]>\u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" >\u003Ctr>\u003Ctd>\u003C![endif]-->\n \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#55acee;border-radius:3px;width:18px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"font-size:0;height:18px;vertical-align:middle;width:18px;\">\n \u003Ca href=\"https://twitter.com/mokkapps\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n \u003Cimg height=\"18\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/twitter.png\" style=\"border-radius:3px;display:block;\" width=\"18\">\n \u003C/a>\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \u003C/td>\n \n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#000000;border-radius:3px;width:18px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"font-size:0;height:18px;vertical-align:middle;width:18px;\">\n \u003Ca href=\"https://github.com/mokkapps\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n \u003Cimg height=\"18\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/github.png\" style=\"border-radius:3px;display:block;\" width=\"18\">\n \u003C/a>\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \u003C/td>\n \n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#3f729b;border-radius:3px;width:18px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"font-size:0;height:18px;vertical-align:middle;width:18px;\">\n \u003Ca href=\"https://instagram.com/mokkapps\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n \u003Cimg height=\"18\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/instagram.png\" style=\"border-radius:3px;display:block;\" width=\"18\">\n \u003C/a>\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \u003C/td>\n \n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#EB3323;border-radius:3px;width:18px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"font-size:0;height:18px;vertical-align:middle;width:18px;\">\n \u003Ca href=\"https://youtube.com/@mokkapps\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n \u003Cimg height=\"18\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/youtube.png\" style=\"border-radius:3px;display:block;\" width=\"18\">\n \u003C/a>\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \u003C/td>\n \n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#0077b5;border-radius:3px;width:18px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"font-size:0;height:18px;vertical-align:middle;width:18px;\">\n \u003Ca href=\"https://www.linkedin.com/shareArticle?mini=true&url=https://www.linkedin.com/in/mokkapps&title=&summary=&source=\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n \u003Cimg height=\"18\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/linkedin.png\" style=\"border-radius:3px;display:block;\" width=\"18\">\n \u003C/a>\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \u003C/td>\n \n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cp style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:100%;\">\n \u003C/p>\n \n \u003C!--[if mso | IE]>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:550px;\" role=\"presentation\" width=\"550px\" >\u003Ctr>\u003Ctd style=\"height:0;line-height:0;\">  \n\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:120px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-20 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">Share via\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003Ctd class=\"\" style=\"vertical-align:top;width:480px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-80 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \n \u003C!--[if mso | IE]>\u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" >\u003Ctr>\u003Ctd>\u003C![endif]-->\n \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#3b5998;border-radius:3px;width:20px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"font-size:0;height:20px;vertical-align:middle;width:20px;\">\n \u003Ca href=\"https://www.facebook.com/sharer/sharer.php?u=https://weekly-vue.news/issues/86\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n \u003Cimg height=\"20\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/facebook.png\" style=\"border-radius:3px;display:block;\" width=\"20\">\n \u003C/a>\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \u003C/td>\n \n \u003Ctd style=\"vertical-align:middle;\">\n \u003Ca href=\"https://www.facebook.com/sharer/sharer.php?u=https://weekly-vue.news/issues/86\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: #333333; font-size: 12px; font-family: NotoSans, Helvetica, sans-serif; line-height: 22px; text-decoration: none;\" target=\"_blank\">\n Facebook\n \u003C/a>\n \u003C/td>\n \n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#55acee;border-radius:3px;width:20px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"font-size:0;height:20px;vertical-align:middle;width:20px;\">\n \u003Ca href=\"https://twitter.com/intent/tweet?url=https://weekly-vue.news/issues/86\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n \u003Cimg height=\"20\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/twitter.png\" style=\"border-radius:3px;display:block;\" width=\"20\">\n \u003C/a>\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \u003C/td>\n \n \u003Ctd style=\"vertical-align:middle;\">\n \u003Ca href=\"https://twitter.com/intent/tweet?url=https://weekly-vue.news/issues/86\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: #333333; font-size: 12px; font-family: NotoSans, Helvetica, sans-serif; line-height: 22px; text-decoration: none;\" target=\"_blank\">\n Twitter\n \u003C/a>\n \u003C/td>\n \n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#0077b5;border-radius:3px;width:20px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"font-size:0;height:20px;vertical-align:middle;width:20px;\">\n \u003Ca href=\"https://www.linkedin.com/shareArticle?mini=true&url=https://weekly-vue.news/issues/86&title=&summary=&source=\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n \u003Cimg height=\"20\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/linkedin.png\" style=\"border-radius:3px;display:block;\" width=\"20\">\n \u003C/a>\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \u003C/td>\n \n \u003Ctd style=\"vertical-align:middle;\">\n \u003Ca href=\"https://www.linkedin.com/shareArticle?mini=true&url=https://weekly-vue.news/issues/86&title=&summary=&source=\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: #333333; font-size: 12px; font-family: NotoSans, Helvetica, sans-serif; line-height: 22px; text-decoration: none;\" target=\"_blank\">\n LinkedIn\n \u003C/a>\n \u003C/td>\n \n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cp style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:100%;\">\n \u003C/p>\n \n \u003C!--[if mso | IE]>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:550px;\" role=\"presentation\" width=\"550px\" >\u003Ctr>\u003Ctd style=\"height:0;line-height:0;\">  \n\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n \n \n \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n \n \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n \n \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n \u003Ctbody>\n \n \u003Ctr>\n \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:11px;font-weight:300;line-height:24px;text-align:center;color:#9B9B9B;\">\u003Ca href=\"https://weekly-vue.news/unsubscribe?token=UNSUBSCRIBE_TOKEN_PLACEHOLDER\" style=\"text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: #9b9b9b;\">Unsubscribe\u003C/a> from this newsletter\u003Cbr>Holzapfelkreuther Str. 19, 81375 Munich, Germany\u003Cbr>\u003C/div>\n \n \u003C/td>\n \u003C/tr>\n \n \u003Ctr>\n \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n \n \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"border-collapse:collapse;border-spacing:0px;\">\n \u003Ctbody>\n \u003Ctr>\n \u003Ctd style=\"width:1px;\">\n \n \u003Cimg height=\"1\" src=\"https://weekly-vue.news/api/log.gif?issueId=86&email=EMAIL_PLACEHOLDER\" style=\"border:0;display:block;outline:none;text-decoration:none;height:1px;width:100%;font-size:13px;\" width=\"1\">\n \n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/td>\n \u003C/tr>\n \n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \u003C/td>\n \u003C/tr>\n \u003C/tbody>\n \u003C/table>\n \n \u003C/div>\n \n \n \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n \n \n \u003C/div>\n \n \u003C/body>\n\u003C/html>\n ",211,86,{"absoluteUrl":15,"relativeUrl":16},"-","og-issue-default.png","2023-03-26T22:00:00.000Z","Weekly Vue News #86 - When to Use Render Function","/issues/86",1,1794479173384]