BestHub
Sign in
Tagged articles
46 articles
Page 1 of 1
JavaScript
JavaScript
Jan 14, 2026 · Frontend Development

Why Vue 3 Drops Mixins and How to Switch to the Composition API

Vue 3 discourages the traditional Mixins pattern due to naming conflicts, unclear origins, namespace pollution, and complex inheritance, and recommends the Composition API, which offers explicit imports, conflict avoidance, better TypeScript support, organized code, and improved testability, along with migration steps for existing projects.

Composition APIMixinsTypeScript
0 likes · 5 min read
Why Vue 3 Drops Mixins and How to Switch to the Composition API
JavaScript
JavaScript
Jan 10, 2026 · Frontend Development

Why Vue3’s Composition API Beats Mixins: Benefits, Code & Migration

Vue3 replaces the problematic mixins pattern of Vue2 with a powerful Composition API, offering explicit dependencies, clearer source tracing, better TypeScript support, and easier maintenance, as illustrated by code examples and a real‑world fintech migration case.

Composition APITypeScriptVue3
0 likes · 5 min read
Why Vue3’s Composition API Beats Mixins: Benefits, Code & Migration
Node.js Tech Stack
Node.js Tech Stack
Dec 28, 2025 · Frontend Development

Vue 3.6 Beta Introduces Full‑Featured Vapor Mode—Can It Match Solid’s Performance?

Vue 3.6.0‑beta.1 brings the long‑awaited Vapor Mode to feature parity (except Suspense), claims benchmark‑level performance comparable to Solid and Svelte 5, overhauls the reactivity system with alien‑signals, and offers an opt‑in, composition‑API‑only path with clear limitations for existing projects.

Composition APIReactivitySolidJS
0 likes · 6 min read
Vue 3.6 Beta Introduces Full‑Featured Vapor Mode—Can It Match Solid’s Performance?
JavaScript
JavaScript
Nov 1, 2025 · Frontend Development

Why Vue 3’s Composition API Beats Mixins: Benefits and Migration Guide

The article explains how Vue 3’s Composition API resolves the naming conflicts, hidden dependencies, and reusability limits of Vue 2 mixins, showcases practical code examples, and describes a real‑world fintech migration that makes component logic clearer and more maintainable.

Code RefactoringComposition APIMixins
0 likes · 6 min read
Why Vue 3’s Composition API Beats Mixins: Benefits and Migration Guide
JavaScript
JavaScript
Oct 1, 2025 · Frontend Development

Why Vue 3’s Composition API Beats Mixins: Real‑World Refactor Insights

Vue 3 replaces the once‑popular mixins pattern with the Composition API, offering explicit dependencies, clearer source tracing, better TypeScript support, and improved maintainability, as illustrated by a fintech trading platform’s migration from tangled mixins to clean, reusable composition functions.

Composition APIJavaScriptMixins
0 likes · 6 min read
Why Vue 3’s Composition API Beats Mixins: Real‑World Refactor Insights
MoonWebTeam
MoonWebTeam
May 24, 2025 · Frontend Development

How Clean Architecture and Vue 3 Composition API Simplify Complex Frontend Projects

This article examines the growing complexity of a points‑mall front‑end, identifies architectural and code‑organization pain points, and demonstrates how applying Clean Architecture together with Vue 3's Composition API can decouple business logic from UI, improve maintainability, and streamline development.

Clean ArchitectureComposition APIsoftware design
0 likes · 22 min read
How Clean Architecture and Vue 3 Composition API Simplify Complex Frontend Projects
JavaScript
JavaScript
May 12, 2025 · Frontend Development

Why Vue 3 Discourages Mixins and How Composition API Solves Their Problems

The article explains why Vue 3 no longer recommends the Mixins pattern, outlines its drawbacks such as naming conflicts and unclear data origins, and demonstrates how the Composition API provides a clearer, more maintainable alternative for reusable logic.

Composition APIJavaScriptMixins
0 likes · 5 min read
Why Vue 3 Discourages Mixins and How Composition API Solves Their Problems
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Apr 20, 2025 · Frontend Development

Vue 2.0 vs Vue 3.0: Core Differences, Reactive System, Composition API, Lifecycle Hooks and Practical Code Examples

This article provides a comprehensive comparison between Vue 2 and Vue 3, covering changes in reactivity implementation, the introduction of the Composition API, lifecycle hook updates, component caching, data binding techniques, state‑management alternatives, storage options, and numerous code snippets that illustrate each concept for developers preparing for interviews or upgrading projects.

Composition APIJavaScriptVue2
0 likes · 25 min read
Vue 2.0 vs Vue 3.0: Core Differences, Reactive System, Composition API, Lifecycle Hooks and Practical Code Examples
JavaScript
JavaScript
Mar 26, 2025 · Frontend Development

Why Vue3’s Composition API Beats Mixins: Benefits, Code & Migration Guide

Vue3’s Composition API replaces mixins with explicit, reusable functions, eliminating naming conflicts, hidden dependencies, and improving TypeScript support, as illustrated by a fintech trading platform migration case study. The article also compares the golden age of mixins, outlines their pitfalls, and provides code examples for a smooth transition.

Composition APIJavaScriptTypeScript
0 likes · 6 min read
Why Vue3’s Composition API Beats Mixins: Benefits, Code & Migration Guide
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 14, 2024 · Frontend Development

How to Transform Your Vue2 Codebase to Vue3 with Script Setup

This article walks through the practical steps for migrating a Vue2 project to Vue3, covering script‑setup syntax, composition‑API patterns, removal of mixins and global variables, file‑naming conventions, and reusable composable functions to achieve a cleaner, more maintainable codebase.

Composition APIScript SetupVue3
0 likes · 11 min read
How to Transform Your Vue2 Codebase to Vue3 with Script Setup
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 1, 2024 · Frontend Development

Migrating a Vue2 Project to Vue3 with Pinia and Composition API

This article details a step‑by‑step migration from Vue 2 to Vue 3, emphasizing the use of the latest Vue 3 version, TypeScript typings, replacing mixins with composition functions, adopting Pinia for state management, and demonstrating how to share and protect reactive state with composition APIs.

Composition APIState ManagementTypeScript
0 likes · 8 min read
Migrating a Vue2 Project to Vue3 with Pinia and Composition API
Java Tech Enthusiast
Java Tech Enthusiast
Nov 25, 2024 · Frontend Development

Understanding Vue Composables (Hooks) and Their Usage

Vue’s reusable logic pattern, called Composables, are functions built with the Composition API that encapsulate reactive state via ref and lifecycle hooks, follow a use‑prefix naming convention, and let developers like the mouse‑tracker example share stateful behavior across components cleanly.

ComposablesComposition APIVue
0 likes · 5 min read
Understanding Vue Composables (Hooks) and Their Usage
Java Architecture Stack
Java Architecture Stack
Oct 9, 2024 · Frontend Development

Mastering Pinia: A Complete Guide to Vue 3 State Management

This comprehensive tutorial walks through Pinia's core concepts—including stores, defineStore, reactive integration, devtools, plugins, TypeScript support, SSR handling, and mapping helpers—providing step‑by‑step code examples and detailed explanations for building robust Vue 3 applications.

Composition APIDevToolsPlugins
0 likes · 26 min read
Mastering Pinia: A Complete Guide to Vue 3 State Management
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 3, 2024 · Frontend Development

Using and Building Custom Hooks in Vue 3

This article explains what Hooks are, demonstrates how to use them in Vue 3, and guides readers through building reusable custom Hook functions such as useMouse and useTable, covering pagination, parameter handling, and best practices for clean, maintainable frontend code.

Composition APIJavaScriptVue
0 likes · 23 min read
Using and Building Custom Hooks in Vue 3
IT Services Circle
IT Services Circle
Jul 23, 2024 · Frontend Development

Vue2 vs Vue3: Differences, New Features, and Migration Guide

This article provides a comprehensive comparison between Vue 2 and Vue 3, detailing their architectural differences, new features such as the Composition API, TypeScript support, fragments, teleport, suspense, virtual‑DOM optimizations, and guidance on state management, build tools, and migration strategies.

Composition APIJavaScriptVue
0 likes · 20 min read
Vue2 vs Vue3: Differences, New Features, and Migration Guide
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jul 9, 2024 · Frontend Development

Vue 3 Composition API: defineProps, defineEmits, defineExpose, defineOptions, and defineSlots – Detailed Guide and Usage Examples

This article provides a comprehensive overview of Vue 3's new composition API functions—defineProps, defineEmits, defineExpose, defineOptions, and defineSlots—explaining their purposes, basic usage, practical examples, and suitable scenarios, helping developers master component communication, reuse, and advanced configuration in modern frontend development.

Composition APIVue3defineProps
0 likes · 13 min read
Vue 3 Composition API: defineProps, defineEmits, defineExpose, defineOptions, and defineSlots – Detailed Guide and Usage Examples
ByteFE
ByteFE
May 10, 2024 · Frontend Development

Understanding and Using Custom Hooks (Composition API) in Vue 3

This article explains the concept of custom hooks—known as the Composition API—in Vue 3, discusses when and why to use them for logic reuse, provides practical examples and code snippets, and shares a curated list of useful Vue 3 hook libraries and resources.

Composition APICustom HooksJavaScript
0 likes · 9 min read
Understanding and Using Custom Hooks (Composition API) in Vue 3
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jan 8, 2024 · Frontend Development

Understanding and Using Hooks in Vue 3 Composition API

This article introduces Vue 3 Hooks, explains their relationship to the Composition API, compares them with mixins and class‑based patterns, provides best‑practice guidelines, and offers multiple TypeScript code examples for creating, using, and managing custom hooks to improve code reuse and maintainability.

Composition APIJavaScriptVue
0 likes · 17 min read
Understanding and Using Hooks in Vue 3 Composition API
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 17, 2023 · Frontend Development

Comprehensive Vue 3 Tutorial: Project Setup, Option vs Composition API, and Custom Hooks

This tutorial walks through creating a Vue 3 project, explains key changes and the differences between Option API and Composition API, demonstrates useful CLI commands, and provides detailed examples of custom composable hooks such as useWindowSize, usePagination, and useFetch, along with best practices.

Composition APICustom HooksOption API
0 likes · 19 min read
Comprehensive Vue 3 Tutorial: Project Setup, Option vs Composition API, and Custom Hooks
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 11, 2023 · Frontend Development

Converting State‑Driven Dialogs to Command‑Style Calls with the useCommandComponent Hook

This article explains how to convert state‑driven Element‑Plus Dialog components into a command‑style API using a custom useCommandComponent hook, discusses the drawbacks of traditional Dialog handling, outlines required component conventions, provides implementation code, and offers practical usage examples for Vue developers.

Composition APIDialogVue
0 likes · 11 min read
Converting State‑Driven Dialogs to Command‑Style Calls with the useCommandComponent Hook
php Courses
php Courses
Mar 10, 2023 · Frontend Development

Differences Between Vue 2 and Vue 3: Reactivity, Runtime, Compiler, and New Features

The article explains how Vue 3 improves upon Vue 2 by replacing Object.defineProperty with Proxy for reactivity, introducing a refined runtime renderer, a compiler that transforms templates into render functions, and new features such as the Composition API, script setup, and built‑in components like Fragment and Teleport.

Composition APIReactivityVue
0 likes · 6 min read
Differences Between Vue 2 and Vue 3: Reactivity, Runtime, Compiler, and New Features
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 24, 2022 · Frontend Development

Implementing an Icon Component in Vue3: Structure, Props, CSS Variables, and Global Registration

This article walks through building a reusable Icon component with Vue3's Composition API, covering directory layout, prop definitions, TypeScript typing, CSS variable styling, local and global registration, type augmentation, and the use of the defineOptions macro for component naming.

CSS VariablesComponent RegistrationComposition API
0 likes · 25 min read
Implementing an Icon Component in Vue3: Structure, Props, CSS Variables, and Global Registration
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 18, 2022 · Frontend Development

Implementing Vue 3 Computed API from Scratch

This article explains how to recreate Vue 3's computed API using the composition API, covering getter/setter handling, effect integration, caching with a dirty flag, dependency tracking, and trigger mechanisms, and provides step‑by‑step code examples to build a functional ComputedRef implementation.

Composition APIJavaScriptReactivity
0 likes · 10 min read
Implementing Vue 3 Computed API from Scratch
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 9, 2022 · Frontend Development

10 Real‑World Vue 3 Migration Scenarios Every Developer Should Master

This article walks through ten common Vue 3 migration scenarios—parent‑child data flow, two‑way binding, router navigation, context access, slots, component caching, logic reuse, lifecycle hooks, global APIs, and TypeScript integration—providing clear explanations and complete code examples for each case.

Composition APIScript SetupTypeScript
0 likes · 16 min read
10 Real‑World Vue 3 Migration Scenarios Every Developer Should Master
php Courses
php Courses
Sep 15, 2022 · Frontend Development

Advanced Vue 3 Techniques: createVNode, render, JSX/TSX, Dependency Injection, Composition API, and Global Component Registration

This article presents a comprehensive guide to Vue 3 advanced features, covering the use of createVNode and render for dynamic component creation, JSX/TSX advantages, dependency injection with provide/inject, Composition API patterns, utility hooks, global component registration, script‑setup syntax, and the latest v‑model usage, all illustrated with practical code examples.

Composition APIGlobal ComponentsJSX
0 likes · 19 min read
Advanced Vue 3 Techniques: createVNode, render, JSX/TSX, Dependency Injection, Composition API, and Global Component Registration
BaiPing Technology
BaiPing Technology
May 24, 2022 · Frontend Development

Why Vue 3 Lifecycle Hooks Fail in Async Setup and How to Fix Them

This article explains the restrictions of using Vue 3 Composition API lifecycle hooks inside asynchronous setup code, demonstrates the warning Vue emits, and shows how the framework links hooks to component instances through its source code, offering a safe way to inject hooks asynchronously.

Async SetupComposition APIlifecycle hooks
0 likes · 13 min read
Why Vue 3 Lifecycle Hooks Fail in Async Setup and How to Fix Them
php Courses
php Courses
Mar 24, 2022 · Frontend Development

Introduction to Vue 3, Its New Features and Composition API

This article provides a comprehensive overview of Vue 3—including its release details, performance gains, core architectural changes such as Proxy‑based reactivity, TypeScript support, the new Composition API (setup, ref, reactive, computed, watch, watchEffect), updated lifecycle hooks, new built‑in components like Fragment, Teleport and Suspense, project scaffolding with Vue‑CLI or Vite, and migration considerations from Vue 2.

Composition APIJavaScriptVite
0 likes · 14 min read
Introduction to Vue 3, Its New Features and Composition API
ELab Team
ELab Team
Feb 11, 2022 · Frontend Development

Master Vue 3: Key Differences, New APIs, and Migration Tips

This article provides a comprehensive guide to Vue 3, covering its performance improvements, tree‑shaking support, Composition API, new global APIs, lifecycle changes, reactive system enhancements, and practical code examples to help developers migrate from Vue 2 to Vue 3 efficiently.

Composition APIJavaScriptVue3
0 likes · 13 min read
Master Vue 3: Key Differences, New APIs, and Migration Tips
php Courses
php Courses
Dec 12, 2021 · Frontend Development

Understanding Vue 3 Composition API: Ref, Reactive, toRefs, Computed, Watch, Provide/Inject, and Lifecycle Hooks

This article explains Vue 3's Composition API, covering how to create reactive data with ref and reactive, use toRefs, define computed properties, apply readonly, watch and watchEffect, handle lifecycle hooks, pass props, and share state via provide and inject, all with practical code examples.

Composition APIJavaScriptRef
0 likes · 8 min read
Understanding Vue 3 Composition API: Ref, Reactive, toRefs, Computed, Watch, Provide/Inject, and Lifecycle Hooks
Sohu Tech Products
Sohu Tech Products
Sep 8, 2021 · Frontend Development

Practical Guide to Vue 3.2 Setup Sugar, <script setup> with TypeScript, and New Vue APIs

This article walks through preparing a Vue 3 + TypeScript project, explains the concept of setup sugar and its benefits, demonstrates the new compiler‑macro APIs such as defineProps, defineEmits and defineExpose, introduces useful hook APIs, covers Vue 3.2 additions like v‑memo and style‑variable binding, and provides tips for i18n, debugging and common pitfalls.

Composition APIScript SetupVolar
0 likes · 17 min read
Practical Guide to Vue 3.2 Setup Sugar, <script setup> with TypeScript, and New Vue APIs
Taobao Frontend Technology
Taobao Frontend Technology
Jun 24, 2021 · Frontend Development

Rethinking React Hooks: Functional Programming, TypeScript, and Cross‑Framework Insights

This article explores why React moved from class components to the Hooks API, explains its functional‑programming roots, compares Hooks with Redux, Mixins, HOCs, Vue's Composition API, and demonstrates how TypeScript type inference and codata concepts can deepen understanding while providing practical code examples.

Composition APIReactVue
0 likes · 21 min read
Rethinking React Hooks: Functional Programming, TypeScript, and Cross‑Framework Insights
Baidu App Technology
Baidu App Technology
May 14, 2021 · Frontend Development

Deep Dive into Vue 3 Composition API: Design, Analysis, and Practical Implementation

The article thoroughly examines Vue 3’s Composition API, explaining its motivation over the Options API, detailing its function‑based design and TypeScript advantages, addressing concerns about complexity, and offering practical guidance on when and how to adopt it for cleaner, more maintainable component logic.

Component DesignComposition APILogic Reuse
0 likes · 12 min read
Deep Dive into Vue 3 Composition API: Design, Analysis, and Practical Implementation
Alibaba Terminal Technology
Alibaba Terminal Technology
Apr 7, 2021 · Frontend Development

Why Hooks? Uncovering the Functional Foundations of React and Beyond

This article explores the motivations behind React's Hooks API, contrasts it with the Class API, delves into functional programming concepts, demonstrates implementations via Mixins, HOCs, and custom hooks, and compares React Hooks to Vue's Composition API, offering deep insights for front‑end developers.

Composition APIReactTypeScript
0 likes · 22 min read
Why Hooks? Uncovering the Functional Foundations of React and Beyond
QQ Music Frontend Team
QQ Music Frontend Team
Jan 9, 2021 · Frontend Development

What’s New in Vue 3? A Deep Dive into Architecture, Reactivity, and Vite

This article provides a comprehensive overview of Vue 3, covering its evolution from Vue 2, key new features such as TypeScript support, the Composition API, performance optimizations, the modular monorepo structure, the reactivity system built on Proxy, and the Vite development server that powers its ecosystem.

Composition APIJavaScriptReactivity
0 likes · 28 min read
What’s New in Vue 3? A Deep Dive into Architecture, Reactivity, and Vite
Youzan Coder
Youzan Coder
Dec 23, 2020 · Frontend Development

Vant 3.0: Comprehensive Vue 3 Migration and New Features

Vant 3.0 delivers a full Vue 3 migration, refactoring all components with the Composition API, adding emits options and Teleport support, shrinking bundle size, introducing Badge, Popover and Cascader components, a new Vant Use 1.0 logic library, and upgraded CLI tooling while maintaining Vue 2 compatibility.

Composition APIJavaScript frameworkVant 3.0
0 likes · 7 min read
Vant 3.0: Comprehensive Vue 3 Migration and New Features
Aotu Lab
Aotu Lab
Oct 10, 2020 · Frontend Development

How to Leverage Vue3’s New Features in Taro for Multi‑Platform Development

This guide walks through using Vue3’s Composition API, Teleport, Fragments, script‑setup, and style‑vars within Taro, covering installation, project setup, code examples for each feature, build commands, and compatibility notes for both H5 and mini‑program targets.

Composition APIFragmentsScript Setup
0 likes · 13 min read
How to Leverage Vue3’s New Features in Taro for Multi‑Platform Development