This article details how a video editing page built entirely with Flutter and Redux can overcome state, logic, UI, and performance complexities through architectural decisions, time‑range handling, stack‑based rendering, thumbnail caching, and frame‑rate optimizations to achieve native‑level performance on mainstream devices.
Flink SQL's idle state retention time feature prevents state explosion by automatically cleaning up state for keys that remain inactive beyond a configurable time window, requiring both minimum and maximum retention settings, with implementation details involving CleanupState, timers, and KeyedProcessFunctionWithCleanupState.
This article introduces Kaiyan Kuaichuang's Flutter‑based cross‑platform architecture, covering component layering, state‑management strategies (BLoC, Provider, Redux, Built_redux), data communication via gRPC/ProtoBuf, and a custom URL‑based routing solution, while sharing practical code snippets and lessons learned.
This article explores how Kuaishou Creative leverages Flutter for cross‑platform development, detailing its componentized architecture, page‑level and inter‑page state management approaches, data and page communication mechanisms, and the custom routing solution that unifies navigation across the app.
This article explains the origins of Recoil, why existing tools like Redux, React's built‑in state, and Context fall short for complex shared and derived state scenarios, and how Recoil's atom‑selector architecture, including async selectors and application‑level state observation, addresses flexibility, performance, and robustness in modern React applications.
This article explains the challenges of scaling a page‑building editor, proposes three architectural solutions, and details a design that enables fine‑grained component replacement and shared internal state through a global model, middleware, and extensible plug‑in mechanisms.
This article details the implementation of Spring StateMachine for refactoring a content platform question bank system, addressing complex state management and coupling issues through state machine patterns.
This article shares ten practical pitfalls encountered when moving hourly Spark session jobs to Flink, covering parallelism load imbalance, state TTL, checkpointing strategies, logging, JMX debugging, state migration risks, reduce vs process choices, input data validation, event‑time handling, and external storage considerations, along with concrete configuration snippets and performance tips.
Recoil, Facebook’s experimental state‑management library for React, offers a hook‑based, orthogonal approach that reduces overhead compared to Redux and MobX, supports both synchronous and asynchronous selectors, provides utilities like atomFamily and selectorFamily, and integrates seamlessly with React’s concurrent features, making it a promising frontend solution.
Linke is a decoupled component framework for Xianyu’s frontend that separates UI (View) from business logic (Store) through a clear Interface, adopts MobX for lightweight state management, and thereby boosts code reuse, standardizes development, and cuts maintenance overhead across multiple projects.
This article explains when to use a state‑management solution in Flutter, compares Ephemeral and App state, and provides detailed overviews, usage steps, and pros‑cons of InheritedWidget, Provider, and the newer Riverpod library.
This article shares ten practical pitfalls encountered while moving hour‑level Spark session processing jobs to Apache Flink, covering parallelism skew, state TTL, checkpoint handling, logging, debugging, state migration, Reduce vs Process, input validation, event‑time handling, and the trade‑offs of storing data inside Flink.
This article explains how the QDPaging library, built on Android Jetpack Paging, addresses the limitations of Paging 2 and Paging 3 by providing efficient data preloading, state management, and memory control, resulting in significantly reduced loading wait times and smoother user experiences in mobile apps.
SwiftUI Hooks is an open‑source library that adapts React Hooks concepts for SwiftUI, providing state‑and‑lifecycle hooks such as useState, useEffect, useMemo, and custom hooks, along with usage rules, testing utilities, context handling, and installation instructions for iOS development.
This article reviews React Hooks, compares them with class components, demonstrates change‑driven coding with practical examples, introduces marble diagrams for visualizing state flows, and explores advanced patterns like custom hooks, immutable data handling, and global state management for more maintainable frontend development.
This article provides a detailed learning roadmap for Apache Flink, covering its theoretical background, key research papers, fundamental concepts, core modules, source‑code exploration, real‑time data‑warehouse use cases, event‑driven applications, and emerging trends in the big‑data ecosystem.
This article explains Flutter widget communication techniques—direct value passing, function callbacks, key modification, and GlobalKey—and explores state management solutions including InheritedWidget, Stream, EventBus, Bloc, Scoped_model, Provider, and Redux for cross-widget/page communication, and discusses their underlying principles and usage scenarios.
The article compares traditional React state‑management solutions—Redux’s single‑store with extra libraries and potential re‑renders, and MobX’s fine‑grained but class‑based approach—against the lightweight, hook‑driven Clean‑State library, which avoids providers, reduces bundle size, and offers precise module‑level updates for large and consumer applications.
By examining Flutter’s Dart‑based runtime, cross‑platform GUI framework, and productivity features such as hot‑reload, the article maps these technical strengths to core front‑end challenges—remote communication, state and UI management, and lifecycle handling—offering developers a structured perspective for strategic adoption and future innovation.
This article details the high‑complexity logistics scenario of Cainiao's international import business, explains the evolution from offline to real‑time data warehouses (versions 1.0 and 2.0), describes the layered architecture, enumerates technical challenges such as multi‑source joins, state explosion, out‑of‑order processing, and presents concrete solutions using Flink features, logical middle‑layers, union‑all joins, deduplication, timer services, and batch‑stream hybrid processing.
This article explains how React can serve as a complete state‑management solution by using hooks, lifting state, component composition, the Context API, and optional libraries, while also covering performance tips, server‑cached versus UI state, and when to adopt external tools.
This article explains Redux’s simple yet powerful state‑management model, its three core principles, key concepts such as actions, reducers, and store, and demonstrates how to integrate Redux with React using react‑redux’s Provider and connect APIs with practical code examples.
This article explains the business need for consolidating multiple management back‑ends, evaluates common micro‑frontend approaches, and details why the team selected qiankun, describing its features, integration strategy, routing and storage isolation, and future extensibility considerations.
This article shares practical experiences and insights on using different types of state in Apache Flink for real‑time stream processing, covering managed versus raw state, code examples in Scala and Java, handling late data, dimension table joins, distinct semantics, and best‑practice recommendations.
This article explains how to recreate the React useState hook by following the React source execution flow, describing the update mechanism, circular linked‑list queue, fiber storage, scheduling simulation, and differences from the official implementation, all illustrated with complete JavaScript code examples.
This article details JD Daojia's mobile‑side engineering practices, covering a unified Flutter SDK, resource management, state‑management patterns, precise exposure tracking, and a custom dynamic‑update mechanism that enables hot‑swapping of Flutter binaries and assets on Android.
This article explains Apache Flink's distributed system architecture—including JobManager, ResourceManager, TaskManager, and Dispatcher—covers session and job deployment modes, data transfer mechanisms, event‑time handling with watermarks, various state types and backends, scaling strategies, and the checkpoint/savepoint recovery process.
This article explores why React Hooks can display stale state values, comparing functional and class components, explaining closure behavior, dependency‑array mechanics, proper data‑fetching patterns, and when to replace useState with useReducer to avoid common pitfalls.
This article details Ctrip's practical experience of refactoring its train‑ticket RN module with the Rematch state‑management framework, outlining the background problems of Redux, the three‑phase migration plan, specific challenges such as store compatibility, component decoupling, reuse, and the resulting code‑size reduction and readability improvements.
The article explains how the Wukong Activity Platform enables micro‑components to interact with the editor and property panel by registering lifecycle hooks through a pre‑render step, storing them in a unified Vuex module, and synchronizing state across sandboxed iframes via postMessage and a parent‑store mixin that restores Vue reactivity.
The article explains how the Remote Service Component (RSC) architecture uses a lightweight Vue‑based EventBus for decoupled communication and integrates Vuex with dynamically generated, namespaced stores to manage shared state across hot‑pluggable, visual‑configurable components, solving inter‑component data sharing and namespace collisions.
This article explains how Apache Flink's flexible state management can be leveraged to solve data correlation challenges in real‑time recommendation platforms, compares Flink with Spark and Storm, describes the underlying broadcast and managed state mechanisms, and provides a step‑by‑step implementation using Kafka, Druid, and custom broadcast functions.
This article walks through a multi‑stage refactoring of Vuex API calls for an IoT project, demonstrating how to separate concerns, create a concise olive‑shaped interface, implement custom isomorphic mappers, and normalize responses with three‑level error handling while keeping the codebase maintainable and scalable.
This article explains how Flink's flexible state management, including Broadcast, Keyed, and Operator states, can be used to solve real‑time recommendation challenges such as per‑minute UV, click, and exposure counting, while addressing locality mapping and data‑delay issues with Druid as the downstream store.
The article thoroughly explains Apache Flink’s checkpoint mechanism—including state types, coordinator workflow, exactly‑once versus at‑least‑once semantics, common failure sources such as code exceptions, storage or network issues, and practical configuration tips like interval settings, local recovery and externalized checkpoints.
The article introduces Bifrost, Meituan’s Vue‑based micro‑frontend framework, detailing its background, design goals, architecture, implementation code, development practices, deployment workflow, and the benefits and challenges of adopting micro‑frontend architecture in large‑scale enterprise front‑end projects.
Redux is a predictable JavaScript state container that centralizes a single immutable store, updates it via dispatched actions processed by pure reducers, combines multiple reducers, supports middleware and DevTools, and can be built from scratch by implementing a createStore function with subscribe, getState, and dispatch.
This article outlines the evolution of mini‑program development at Ant Group, describing three engineering stages, essential tooling such as state management, Datahub mocking, monitoring, internationalization, component libraries, and SubApp architecture to bring mini‑programs closer to mainstream front‑end engineering practices.
This comprehensive technical guide explores practical Flutter cross-platform development strategies, detailing architectural design, hybrid engineering integration, routing management, MVVM state handling, platform adaptation, and robust deployment practices including grayscale release, real-time monitoring, and automated rollback mechanisms for mobile applications.
This article provides an in‑depth Flink interview guide covering the framework’s core concepts, advanced features such as fault‑tolerance, state management, and checkpointing, as well as detailed explanations of its architecture, APIs, partitioning strategies, and source‑code flow, complete with code examples.
The article examines how Apache Flink's state management features, including QueryableState and the upcoming Savepoint Processor API, can serve as a lightweight database for real‑time applications, discussing their advantages, limitations, and practical usage scenarios.
This article compares Flink and Spark Structured Streaming, detailing their differences in join capabilities, state management, fault‑tolerance mechanisms, exactly‑once semantics, back‑pressure handling, and table registration, while providing code examples and practical insights for real‑time big‑data processing.
The article details 7FRESH's practical adoption of Flutter since its 1.0 release, describing their layered architecture, Provider-based state management, hybrid codebase strategies, performance benchmarks against H5, manpower efficiency gains, and future roadmap for cross‑platform development.
This article details the end‑to‑end process of building the Pumpkin House Story mobile app using Flutter, covering the project’s background, why Flutter was chosen, environment setup, project creation, architecture, key widgets, plugins, state management, native communication, debugging techniques, and final deployment.
This article compares Apple’s SwiftUI and Google’s Flutter declarative UI frameworks across development environment, UI components, layout, navigation, native integration, and state management, highlighting their similarities, differences, code complexity, and maturity for cross‑platform mobile app development.
Flutter is Google’s UI toolkit that uses the Skia engine and Dart’s AOT/JIT compilation to render directly to a canvas, offering fast, cross‑platform performance, modern language features, flexible state‑management options like setState, InheritedWidget and Bloc, and support for testing, lifecycle handling, and native platform channels for web, desktop, and mobile.
This article analyzes the difficulties of achieving exactly-once delivery in Apache Flink, explains the distinction between state and end‑to‑end exactly‑once, and details how Flink implements exactly‑once sinks using idempotent and transactional approaches, including a Bucketing File Sink example.
This article examines the challenges of component coupling and state sharing in growing frontend projects and proposes a clear container‑presentational component standard, outlining when to lift state, use a store, or rely on events.
This article explains how Apache Flink manages state, uses checkpointing for fault-tolerant recovery, and achieves exactly-once semantics when consuming Kafka streams by persisting offsets, describing the checkpoint mechanism, recovery process, and practical considerations for production deployments.
This article explores Vue 3's function‑based reactivity API, demonstrates how to implement a lightweight, framework‑agnostic reactivity library with watchable objects, functional combinators, and immutable updates, and shows practical examples such as a reactive counter, a todo list, immer‑style state handling, RxJS‑style pipelines, and React‑hooks‑style utilities, while discussing the underlying concepts and limitations.
This article explains why Redux is useful for large React applications, categorizes typical state types, and presents practical patterns—including UI‑driven structures, direct API mapping, and normalized entities—along with code samples and loading‑state management techniques to build maintainable front‑end codebases.
Fish_redux introduces a hierarchical connector that links a child Component to a filtered slice of its parent’s state, using get and set operations to extract and merge sub‑state, enabling efficient, low‑coupling data flow similar to React‑Redux’s connect but within a strict component tree.
This article compares Apache Spark and Apache Flink, outlining their programming models, streaming mechanisms, state management, time semantics, and exactly‑once guarantees, and highlights the strengths and differences of each framework for batch and real‑time big‑data processing.
This week's digest shares a personal anecdote and a series of technical deep‑dives into Apache Flink, covering JOIN LATERAL, TimeInterval JOIN, Temporal Table JOIN, state management, and related code examples, while also previewing upcoming work schedules and recommended Flink reference articles.
This article explains how Apache Flink uses state for incremental stream processing, describes the different state backends, details the persistence mechanism, and shows how both OperatorState and KeyedState are redistributed during scaling using partition and key‑group algorithms.
This article explains how Apache Flink's Interval Join solves time‑bounded join requirements more efficiently than unbounded joins, covering its syntax, semantics, state‑management considerations, and providing a complete Scala example with code and execution results.
This article explains the purpose and types of SQL JOIN operators, demonstrates their syntax and semantics with examples, compares traditional database joins to Apache Flink's streaming two‑stream join implementation, and discusses optimization techniques such as state management, shuffle handling, and join reordering.
This article explains why data flow management is crucial in React, reviews React's built‑in state handling, and compares three popular third‑party solutions—Redux, MobX, and RxJS—highlighting their concepts, strengths, weaknesses, and suitable scenarios for use.
This article introduces Fish Redux, an open‑source Flutter framework from Alibaba that combines Redux‑style state management with a modular component architecture, explains its layered design, performance benefits, and how it simplifies building complex cross‑platform mobile apps.
This article analyzes the difficulties of achieving exactly-once delivery in Apache Flink, explains the distinction between state and end‑to‑end semantics, and details how idempotent and transactional sinks—illustrated with the Bucketing File Sink—realize exactly‑once guarantees through checkpoint‑based two‑phase commit.
The article explores the fundamental problems of UI engineering—consistency, responsiveness, latency, navigation, caching, accessibility, internationalisation, transport, resilience, abstraction, and prioritisation—encouraging developers to solve them by building small, library‑free prototypes to deepen their understanding of trade‑offs.
This article explains Redux’s role in managing complex React state, covering its core concepts such as the single store, immutable state tree, actions, action creators, reducers, middleware, and integration with React via Provider and connect, illustrated with diagrams and practical examples.
The 2018 State of JavaScript survey, answered by over 20,000 developers worldwide, reveals current preferences in languages, frameworks, tools, testing libraries, and emerging trends such as GraphQL and React Hooks, offering valuable insights for front‑end engineers.
This article walks through building an identical ToDo application with React and Vue, comparing their project structures, data mutation mechanisms, component communication, event handling, and code examples, helping developers understand the practical differences between the two popular frontend frameworks.
This article explains React as a JavaScript library for building user interfaces, covering its component model, state‑driven rendering, DOM diffing, pure functions, the importance of treating it as a library rather than a framework, and practical state management with MobX.
This article summarizes Meituan’s real‑time computing platform, detailing its layered architecture built on Kafka, Flink on YARN, state management, resource isolation, fault tolerance, monitoring, and the Petra metric aggregation system, while highlighting the challenges faced and the solutions implemented to achieve high‑throughput, low‑latency stream processing at massive scale.
This article explains the fundamentals and deep internals of React’s setState method, covering basic usage, asynchronous behavior, state‑update pitfalls, functional updates, and the underlying mechanisms such as enqueueSetState, enqueueUpdate, batchingStrategy, and transaction processing, illustrated with code snippets and diagrams.
This article shares the Yueqi Reading team's three‑month journey of building a large‑scale React Native app, covering business background, technology selection, navigation management, state persistence, performance tuning, release automation, error monitoring, common pitfalls, and practical tips for mobile developers.
RxJS brings the Observable pattern to JavaScript, enabling asynchronous multiple-value streams that combine observer, iterator, and functional concepts, and the article shows how to use it in React and Redux for clean subscription management, data aggregation, advanced async handling, and time‑based operations.
This article explains how MobX replaces Redux for state management in a React Native flight‑ticket app, detailing its architecture, module breakdown, implementation steps, and the performance and maintenance advantages it brings to complex mobile projects.
This article delves into Flutter’s rendering pipeline, explaining the three‑tree architecture, build‑layout‑paint stages, state lifecycle, data flow, and optimization techniques such as relayout and repaint boundaries, while highlighting common pitfalls and best practices for high‑performance Flutter UI development.
This article walks through creating a React application without scaffolding tools, detailing project directory layout, chosen technology stack—including React, Redux, Immutable.js, react-router, redux-saga, and related debugging and persistence utilities—while explaining component design, middleware, enhancers, routing, and asynchronous task management.
This article shares practical strategies for designing, dividing, and managing React components in a large‑scale CRM system, covering component hierarchy, state and props handling, data communication, common pitfalls, and best practices to improve maintainability and performance.
This article walks front‑end developers through the author's deductive model of React, covering transformation, abstraction, composition, state handling, memoization, list management, continuations, state maps, and algebraic effects with clear code examples.
Redux is a JavaScript state container that enforces a single‑store, unidirectional data flow using actions, reducers and middleware, drawing on Flux, CQRS and event sourcing, and the article examines its core source files while offering best‑practice guidelines such as immutability, pure reducers, smart‑dumb component separation, and careful middleware use.
This article explains what higher-order components are, how they relate to higher-order functions, and provides a step‑by‑step guide with code examples to extract shared state and lifecycle logic in React components.
This article explains how React renders views, introduces Flux as a unified state‑management architecture, and compares Redux's single‑store, reducer‑based approach, highlighting their core components, data flow, and practical differences for modern frontend development.
Through a detailed source‑code walkthrough, the article explains how Vuex injects the store via a global mixin, builds a hierarchical module tree, binds and implements dispatch and commit methods, enforces strict‑mode mutation checks with a hidden Vue instance, and enables time‑travel debugging by recording mutations and replacing state.
This article explains how to transition from traditional MVC architecture to Redux when building a React‑Native mobile app, detailing the analogies between actions, reducers, stores, and components, and provides step‑by‑step code examples for implementing state management in JavaScript.
This article explains what middleware is, how Redux adopts the middleware pattern, demonstrates the flow of actions with and without middleware, shows how to implement custom middleware including logging and async handling, and presents the official applyMiddleware implementation with code examples.
This article explains Redux’s fundamental ideas—including the store, dispatch, subscribe, actions, reducers, and compose—while comparing it to Flux, illustrating code snippets, and preparing readers for the upcoming middleware discussion, all aimed at front‑end developers seeking a clear grasp of the data‑flow framework.
This article explains the core principles of Redux, when to adopt or avoid it, and provides a detailed walkthrough of its architecture, key components, and practical integration with React, including store creation, reducers, actions, middleware, and project structure.
This article explains the fundamentals of React and Redux, compares them to traditional tools like jQuery, highlights their combined benefits for clean state management, and describes Hulu’s ongoing migration to this modern frontend stack.
This article recounts the Qunar hotel team's experience refactoring a hotel page using React Native, detailing the initial native‑mindset pitfalls, robustness and animation issues, and how adopting a more React‑centric architecture with Redux, connect, and native animation APIs dramatically improved performance, maintainability, and developer experience.
React provides component‑based UI rendering with state‑driven updates, while Flux introduces a unidirectional data flow using stores, dispatchers, and actions to manage state changes, and Redux refines this model by consolidating a single store and pure reducer functions for predictable state management.
This article details the overall architecture of an instant‑messaging client, covering protocol encapsulation, task flow, various timer implementations, state management, reconnection logic, login process, asynchronous handling, and local caching strategies for reliable communication.
This article walks through building a React‑based popup page by first dividing the UI into small, single‑responsibility components, creating a static version, distinguishing props from state, adding interactive state, and finally enabling component communication using Flux‑style PubSub events.
This article provides a structured, high‑level introduction to the HTTP protocol, covering its history, versions, network layer placement, request and response formats, headers, status codes, media types, and state‑keeping mechanisms such as cookies and query strings.
