Skip to content

Instantly share code, notes, and snippets.

yyx990803 / repro.html
Created May 10, 2022
Weird detached element memory issue in Chrome
View repro.html
<div id="app">
<button id="reset">reset</button>
<button id="outer">no leak</button>
<div id="container">
<button id="inner">leak</button>
title date author gravatar twitter hidden
Vue 3 将成为新的默认版本

划重点:Vue 3 将在 2022 年 2 月 7 日成为新的默认版本!



  • Migration Build
  • compiler-core: whitespace handling strategy (dee3d6a)
  • support component-level compilerOptions when using runtime compiler (ce0bbe0)
  • config: support configuring runtime compiler via app.config.compilerOptions (091e6d6)
  • support casting plain element to component via is="vue:xxx" (af9e699)
  • devtools: improved KeepAlive support (03ae300)
  • devtools: performance events (f7c54ca)
  • onServerPrefe
yyx990803 / exampe-config.js
Created Jan 13, 2021
A vite plugin that loads the specified deps over CDN during dev, and downloads/includes them into bundle during build.
View exampe-config.js
// example vite.config.js
import { cdn } from './vite-plugin-cdn'
export default {
plugins: [
// also supported:, jspm
// loads the dep over the CDN during dev
// auto downloads and includes into the bundle during build
cdn('skypack', {
vue: '^3.0.5'
View App.vue
<div class="jumbotron">
<div class="row">
<div class="col-md-6">
<h1>Vue.js 3.0.0-alpha4 (keyed)</h1>
<div class="col-md-6">
<div class="row">
<div class="col-sm-6 smallpad">
<button type="button" class="btn btn-primary btn-block" id="run" @click="run">Create 1,000 rows</button>
yyx990803 / svelte.js
Last active Dec 8, 2019
Svelte/Vue generated code size comparison of the TodoMVC implementation. Note: (1) imports are replaced with a const declaration to enable compression. (2) The comparison is between components' "own code" and doesn't include imported runtime code.
View svelte.js
/* App.svelte generated by Svelte v3.14.1 */
/* After terser compression: min:6.00kb / gzip:2.43kb / brotli:2.15kb */
const {
yyx990803 / commits.vue
Last active May 13, 2022
Vue examples comparisons in 2.x and function-based APIs
View commits.vue
<div id="demo">
<h1>Latest Vue.js Commits</h1>
<template v-for="branch in branches">
<input type="radio"
<label :for="branch">{{ branch }}</label>

2.6 Internal Change: Scoped Slot Function Return Value

This change only affects render function users. If you only use templates, you can ignore this change.

The Problem

In render functions, scoped slots are exposed on this.$scopedSlots as functions. Up until now, calling a scoped slot function can return a single VNode or an Array of VNodes based on what the parent component is passing in. For example, given this component:

const Child = {
View async-error.js
export default {
async mounted() {
// if an async error is thrown here, it now will get
// caught by errorCaptured and Vue.config.errorHandler
this.posts = await api.getPosts()