BestHub
Sign in
Tagged articles

frontend

3211 articles · Page 29 of 33
37 Interactive Technology Team
37 Interactive Technology Team
Dec 25, 2017 · Operations

Design and Implementation of a Unified Monitoring Dashboard – A Case Study from 37 Interactive Entertainment

In just over a month, 37 Interactive Entertainment transformed its fragmented monitoring wall into a unified, twelve‑screen dashboard by consolidating game and service data into Elasticsearch, creating a single API, and employing modular JavaScript, custom ECharts visualizations and a 3D map, delivering real‑time insights with a cohesive sci‑fi inspired UI.

DashboardELKMonitoring
0 likes · 7 min read
Design and Implementation of a Unified Monitoring Dashboard – A Case Study from 37 Interactive Entertainment
21CTO
21CTO
Dec 20, 2017 · Frontend Development

Explore the Best Frontend UI Frameworks for Mobile, PC & Hybrid Apps

This guide compiles the most popular frontend UI frameworks for mobile, PC and hybrid app development, summarizing each library's origin, key features, GitHub statistics, installation methods and demo links to help developers quickly choose the right toolkit.

UI frameworkWebfrontend
0 likes · 17 min read
Explore the Best Frontend UI Frameworks for Mobile, PC & Hybrid Apps
21CTO
21CTO
Dec 17, 2017 · Frontend Development

Boost Site Speed with PJAX: Combine pushState and Ajax for Faster Navigation

This tutorial explains how PJAX combines HTML5 pushState with Ajax to replace page content without full reloads, dramatically speeding up website navigation, and provides step‑by‑step installation, example code, and performance benefits for modern front‑end development.

AJAXPJAXWeb Performance
0 likes · 9 min read
Boost Site Speed with PJAX: Combine pushState and Ajax for Faster Navigation
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Dec 16, 2017 · Frontend Development

How Node Server‑Side Rendering Boosts Front‑End Performance and SEO

This article explains the evolution of web front‑end development, introduces the concept of server‑side rendering (SSR) with Node, details practical implementation steps—including pure front‑end, Node‑based SSR, AJAX request merging, and build‑time code splitting—and shares lessons learned from applying these techniques in real projects.

CDNServer-side Renderingfrontend
0 likes · 11 min read
How Node Server‑Side Rendering Boosts Front‑End Performance and SEO
Liulishuo Tech Team
Liulishuo Tech Team
Dec 15, 2017 · Frontend Development

Mastering Frontend Unit Testing: Mocha vs Jest and Practical Tips

This article explores why unit testing is essential for frontend projects, compares Mocha and Jest across assertions, coverage, environment setup, mocking, snapshots, and watch mode, and offers practical guidance on choosing tools, writing maintainable tests, and balancing coverage with development speed.

CoverageJavaScriptJest
0 likes · 19 min read
Mastering Frontend Unit Testing: Mocha vs Jest and Practical Tips
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Dec 10, 2017 · Frontend Development

Why Front‑End/Back‑End Separation Is Essential for Modern Web Apps

This article explains why front‑end/back‑end separation is increasingly popular, outlines its benefits over traditional monolithic web development, and demonstrates a practical implementation using Vue, Node.js, and Express for a movie ticketing system, including mock data handling and deployment tips.

Web Developmentfrontendnodejs
0 likes · 8 min read
Why Front‑End/Back‑End Separation Is Essential for Modern Web Apps
21CTO
21CTO
Dec 9, 2017 · Frontend Development

Top 7 Web Development Trends Shaping 2018 and Beyond

From AI-powered chatbots and Motion UI to blockchain, AR, single-page sites, progressive web apps, and push notifications, this guide outlines the most impactful web development trends of 2018, highlighting how each technology enhances user experience, security, and engagement across modern web projects.

AIARProgressive Web Apps
0 likes · 5 min read
Top 7 Web Development Trends Shaping 2018 and Beyond
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Dec 7, 2017 · Frontend Development

How to Achieve Smooth 60 FPS Web Animations on Low‑End Devices

This article explains why 60 FPS is the benchmark for fluid web animations, shows how to measure frame rates with requestAnimationFrame, compares CSS and JavaScript animation performance on TV‑box hardware, and provides a step‑by‑step optimization guide using GPU acceleration, will‑change, and dev‑tools.

GPU AccelerationWeb animationcss animation
0 likes · 16 min read
How to Achieve Smooth 60 FPS Web Animations on Low‑End Devices
Qunar Tech Salon
Qunar Tech Salon
Dec 6, 2017 · Frontend Development

Using Draft.js for Custom Rich Text Editing in React

This article explains how Draft.js, a React‑based rich‑text editor framework, can be applied to build a customizable editor with support for structured content, immutable state management, custom block rendering, data conversion, and hook handling, providing code examples throughout.

Draft.jsJavaScriptReAct
0 likes · 9 min read
Using Draft.js for Custom Rich Text Editing in React
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Dec 5, 2017 · Frontend Development

How Node Direct Output Supercharges Frontend Performance and SEO

This article explains the concept of server‑side direct output (Node direct output), its evolution from static pages to modern front‑end/back‑end separation, and provides a practical implementation using Node, webpack loaders, conditional compilation, and CDN asset management to accelerate page loads and improve SEO.

CDNServer-side Renderingfrontend
0 likes · 15 min read
How Node Direct Output Supercharges Frontend Performance and SEO
21CTO
21CTO
Nov 26, 2017 · Frontend Development

Mastering Web Image Optimization: Formats, Compression, and Responsive Techniques

This article explains the fundamentals of web image optimization, covering vector vs raster formats, compression methods, responsive image techniques with srcset and picture elements, and practical loading strategies such as lazy loading, sprites, and progressive JPEGs to improve front‑end performance.

Responsive ImagesWeb Performancecompression
0 likes · 8 min read
Mastering Web Image Optimization: Formats, Compression, and Responsive Techniques
JavaScript
JavaScript
Nov 3, 2017 · Frontend Development

How to Embed Web Pages in Mini-Programs Using the Web-View Component

Developers can now flexibly embed web pages within mini-programs using the web-view component, which fills the entire page as a container, though it currently excludes personal and overseas mini-program types, and the guide shows the required WXML markup to set the source URL.

WeChatembeddingfrontend
0 likes · 1 min read
How to Embed Web Pages in Mini-Programs Using the Web-View Component
Meituan Technology Team
Meituan Technology Team
Oct 30, 2017 · Frontend Development

Hermes Project: Front‑End Architecture, Modularization, Componentization, Automation and Performance Optimization at Meituan‑Dianping

The Hermes project at Meituan‑Dianping re‑engineered its overseas vacation front‑end by separating front‑ and back‑ends, modularizing code with ES6, building a Vue‑based reusable component library, automating builds and testing, and optimizing page‑load performance through CDN caching, monitoring, and offline strategies, dramatically boosting developer productivity and user experience.

ComponentizationMeituanModularization
0 likes · 15 min read
Hermes Project: Front‑End Architecture, Modularization, Componentization, Automation and Performance Optimization at Meituan‑Dianping
21CTO
21CTO
Oct 22, 2017 · Frontend Development

Mastering React: From Transformation to Algebraic Effects

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.

Component ArchitectureJavaScriptReAct
0 likes · 9 min read
Mastering React: From Transformation to Algebraic Effects
网易UEDC
网易UEDC
Oct 16, 2017 · Frontend Development

How Component‑Based Design Transforms Online Education Platforms

This article explores the benefits, challenges, and practical methods of applying component‑based design to question banks and exam assembly modules in online education, offering insights on reuse, consistency, requirement analysis, and solution strategies for scalable, flexible UI development.

Education TechnologyUI-UXcomponent design
0 likes · 13 min read
How Component‑Based Design Transforms Online Education Platforms
21CTO
21CTO
Oct 9, 2017 · Frontend Development

Master JavaScript Debugging: Step-by-Step Guide Using Chrome DevTools

Learn how to efficiently locate and fix JavaScript bugs by reproducing errors, setting breakpoints, stepping through code, inspecting variables with Watch expressions, and editing code directly in Chrome DevTools, all demonstrated through a concrete addition calculator example.

Chrome DevToolsDebuggingJavaScript
0 likes · 8 min read
Master JavaScript Debugging: Step-by-Step Guide Using Chrome DevTools
Baixing.com Technical Team
Baixing.com Technical Team
Oct 9, 2017 · Frontend Development

Mastering WeChat Mini Program Development with the MINA Framework

This article introduces the MINA framework for WeChat Mini Programs, covering its view and logic layers, responsive data binding, page management, core components, API usage, project structure, runtime behavior, and provides a step‑by‑step guide to building a functional expense‑tracking mini‑app with full code examples.

data-bindingfrontendmina-framework
0 likes · 12 min read
Mastering WeChat Mini Program Development with the MINA Framework
Architecture Digest
Architecture Digest
Oct 9, 2017 · Frontend Development

Evolution of Front-End Frameworks: From Web1.0 to MVVM and Beyond

This article traces the historical evolution of front‑end development, examining early Web 1.0 JSP/ASP architectures, the rise of AJAX, and the progression through MVC, MVP, MVVM, and Flux/Redux patterns, highlighting their benefits, drawbacks, and impact on modern front‑end engineering.

AJAXFrameworksMVC
0 likes · 11 min read
Evolution of Front-End Frameworks: From Web1.0 to MVVM and Beyond
CoolHome R&D Department
CoolHome R&D Department
Sep 27, 2017 · Frontend Development

How to Build Reactive Data Synchronization Between Raw and Intermediate Models

This article explains why an intermediate data structure is needed for 3D rendering in a React‑like Virtual DOM environment, how to keep it reactively synchronized with raw graph data using dependency analysis, proxies, and conversion functions, and the performance benefits of minimal partial updates.

Data synchronizationReactive ProgrammingVirtual DOM
0 likes · 12 min read
How to Build Reactive Data Synchronization Between Raw and Intermediate Models
Meituan Technology Team
Meituan Technology Team
Sep 21, 2017 · Frontend Development

Front-End Performance Optimization: Traditional and Perceptual Metrics

Front‑end performance, crucial for traffic and conversion, can be optimized by combining traditional non‑visual metrics (like DNS time, TTFB, and First Paint) with perceptual visual metrics (FCP, FMP, Speed Index, PSI), using tools such as Lighthouse, Chrome DevTools, and the custom Twilight video‑analysis utility, as demonstrated by a Vue‑based flight‑ticket site achieving up to 80% FMP improvement.

LighthouseWebfrontend
0 likes · 10 min read
Front-End Performance Optimization: Traditional and Perceptual Metrics
AntTech
AntTech
Sep 14, 2017 · Frontend Development

Quick Guide to Developing Alipay Mini Programs

This article provides a step‑by‑step tutorial on registering as a developer, obtaining an AppID, installing the Alipay Mini Program IDE, creating a project, editing code, understanding the app and page structure, debugging, previewing on devices, and finally publishing a functional Alipay mini‑program.

AlipayMini ProgramWeb Development
0 likes · 10 min read
Quick Guide to Developing Alipay Mini Programs
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Sep 3, 2017 · Frontend Development

What’s Hot This Week in Web Tech? Apple Event, KSQL, Polymer 3, and More

This week’s IMWeb Frontend Community roundup highlights the Apple September event details, introduces KSQL for Apache Kafka, previews Polymer 3.0’s shift to ES6 modules, discusses the Ayo.js Node.js fork, ASP.NET Core 2 Razor pages, VS 2017 preview, container adoption trends, and Oracle’s cloud database innovations.

Big DataTechnology NewsWeb Development
0 likes · 6 min read
What’s Hot This Week in Web Tech? Apple Event, KSQL, Polymer 3, and More
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Sep 3, 2017 · Frontend Development

Why Does let Appear Not to Be Hoisted? Unraveling JavaScript’s Variable Lifecycle

This article chronicles the author’s two‑month journey of understanding JavaScript’s let declaration, exploring its block scope, temporal dead zone, per‑iteration bindings, and the nuanced differences from var and function hoisting, while debunking common misconceptions with code examples and spec references.

Variable Scopees6frontend
0 likes · 10 min read
Why Does let Appear Not to Be Hoisted? Unraveling JavaScript’s Variable Lifecycle
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 31, 2017 · Frontend Development

From Frameworks to Smart Resource Management: Evolving Frontend Engineering

This article examines the evolution of frontend development from basic library selection through simple build optimization, modularization, and finally to component‑based development and intelligent static resource management, highlighting engineering practices that improve efficiency, scalability, and performance for complex web applications.

ComponentizationEngineeringModularization
0 likes · 21 min read
From Frameworks to Smart Resource Management: Evolving Frontend Engineering
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 29, 2017 · Information Security

Rethinking Web Security: A Front‑End Perspective on Attack and Defense

From a front‑end engineer’s viewpoint, this article dissects web security as a holistic system, examines attack motives, targets, and vectors across browsers, transmission channels, and servers, and proposes coordinated front‑end and back‑end defenses such as encryption, signing, XSS filtering, URL whitelisting, and CSRF mitigation.

Defense Strategiesattack vectorsfrontend
0 likes · 14 min read
Rethinking Web Security: A Front‑End Perspective on Attack and Defense
网易UEDC
网易UEDC
Aug 28, 2017 · Cloud Computing

Essential Skills Every Cloud Computing Interaction Designer Should Master

This article outlines the unique knowledge and abilities required for interaction designers working on cloud computing products, covering core UX competencies, essential front‑end and back‑end development concepts, cloud‑specific technical fundamentals, and vital soft skills, plus a curated reading list for continuous growth.

Cloud ComputingUXbackend
0 likes · 12 min read
Essential Skills Every Cloud Computing Interaction Designer Should Master
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 27, 2017 · Frontend Development

Top Front-End & Tech News This Week: React License, Bootstrap 4, Node.js 8.4, Android Oreo

This weekly roundup delivers the latest front‑end and tech updates, covering Ma Huateng's digital manufacturing insights, React's license controversy, Bootstrap 4 Beta, Node.js 8.4, ESLint 4.5, .NET Core 2, Android Oreo, Puppeteer, the Agile Beach conference, and a new Google Play Store feature.

BootstrapReActWeb Development
0 likes · 6 min read
Top Front-End & Tech News This Week: React License, Bootstrap 4, Node.js 8.4, Android Oreo
Architecture Digest
Architecture Digest
Aug 25, 2017 · Frontend Development

A Comprehensive Guide to Building a Full‑Stack Front‑End Skill Set

This article presents a detailed roadmap for aspiring front‑end engineers, covering essential fundamentals, design principles, development techniques, networking basics, server‑side knowledge, database skills, and soft‑skill practices, while providing practical code examples and resource recommendations.

JavaScriptWeb Developmentcoding standards
0 likes · 45 min read
A Comprehensive Guide to Building a Full‑Stack Front‑End Skill Set
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 24, 2017 · Frontend Development

How CSS3 Transform Alters Stacking, Positioning, and Overflow Behaviors

This article explains how applying CSS3 transform—even with neutral values like scale(1) or translate(0,0)—can unexpectedly change element stacking order, break fixed positioning, modify overflow handling for absolute elements, and affect 100% width calculations across browsers, illustrated with code samples and screenshots.

CSSLayoutfrontend
0 likes · 7 min read
How CSS3 Transform Alters Stacking, Positioning, and Overflow Behaviors
Architecture Digest
Architecture Digest
Aug 24, 2017 · Frontend Development

Designing a Differentiated Front‑End Architecture for Internet Finance Platforms

The article outlines a comprehensive front‑end architecture for an internet‑finance development team, detailing how component‑based, configuration‑driven design, migration from PHP to Node, and shared services (FMS, AXE, SCENE) address frequent scenario changes, risk‑control requirements, and aim to boost development efficiency and product management capability.

ComponentizationConfigurationPHP
0 likes · 8 min read
Designing a Differentiated Front‑End Architecture for Internet Finance Platforms
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 23, 2017 · Frontend Development

Why HTML5 Became the Web’s Game-Changer: History, Features, and Future

HTML5, once a long‑awaited web standard born in 2004 and finalized in 2014, replaced Flash by introducing native multimedia, canvas, WebSockets, and hardware acceleration, while facing prolonged drafting delays and compatibility challenges, ultimately reshaping modern web development and paving the way for richer, plugin‑free experiences.

CanvasHTML5Web Development
0 likes · 12 min read
Why HTML5 Became the Web’s Game-Changer: History, Features, and Future
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 22, 2017 · Frontend Development

Breaking Through CSS Learning Bottlenecks: From Basics to Mastery

This article explores why many front‑end developers hit learning bottlenecks with CSS, illustrates the stages of skill progression using analogies, and offers practical strategies—including deeper detail mastery, mechanism understanding, sharing, and mindset shifts—to overcome those limits.

BottleneckCSSLearning
0 likes · 17 min read
Breaking Through CSS Learning Bottlenecks: From Basics to Mastery
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 21, 2017 · Fundamentals

What Does It Really Take to Be a Modern Full‑Stack Engineer?

This article traces the evolution of the full‑stack developer role from early 2000s tasks like Photoshop design and basic PHP/MySQL work to today’s extensive skill set covering operations, cloud platforms, backend frameworks, databases, frontend tooling, design, logging, and mobile development, and finally asks whether the breadth of knowledge is worth the effort.

DevOpsFull-StackWeb Development
0 likes · 10 min read
What Does It Really Take to Be a Modern Full‑Stack Engineer?
Baixing.com Technical Team
Baixing.com Technical Team
Aug 17, 2017 · Frontend Development

What Is Frontend Development? A Beginner’s Guide to Web Basics

This article, adapted from a university‑level front‑end lecture, explains what front‑end development is, how browsers render pages, the layered architecture of HTML, CSS, and JavaScript, and the modern tools and practices that turn static markup into interactive web applications.

HTMLJavaScriptSPA
0 likes · 15 min read
What Is Frontend Development? A Beginner’s Guide to Web Basics
Architecture Digest
Architecture Digest
Aug 14, 2017 · Frontend Development

An Overview of Modern Front-End Development Workflow and Tools

This article provides a comprehensive overview of the front‑end development workflow, explaining core concepts like HTML, CSS, JavaScript, and detailing essential tools such as npm, Babel, Gulp, Webpack, and popular frameworks like React and Vue, while addressing their roles and interactions.

BabelJavaScriptReAct
0 likes · 8 min read
An Overview of Modern Front-End Development Workflow and Tools
BiCaiJia Technology Team
BiCaiJia Technology Team
Aug 13, 2017 · Frontend Development

What Makes Great UI Design for Games and Mobile Apps?

This article explains the fundamentals of UI design, covering its definition, key components, and the distinct approaches for game interfaces and mobile applications, highlighting how visual appeal and functional interaction together create effective user experiences.

Mobile UIUI designfrontend
0 likes · 4 min read
What Makes Great UI Design for Games and Mobile Apps?
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 13, 2017 · Frontend Development

Frontend Weekly: Storybook 3.2, Webpack WebAssembly, AI in Browser

This week’s front‑end roundup covers Storybook 3.2’s Vue support, Webpack’s first‑class WebAssembly push, WebKit’s PWA plans, a browser‑based neural‑network framework, Coinbase’s $100 M raise, TensorFlow 1.3 updates, Netflix’s Vectorflow, Visual Studio 2017 preview, and Angular AOT memory limits.

Artificial IntelligenceJavaScriptWeb Development
0 likes · 6 min read
Frontend Weekly: Storybook 3.2, Webpack WebAssembly, AI in Browser
Meituan Technology Team
Meituan Technology Team
Aug 10, 2017 · Frontend Development

Front-End Service Availability: Definition, Measurement, and Assurance Practices at Meituan-Dianping Checkout

The article outlines Meituan‑Dianping’s approach to front‑end service availability for its checkout system, defining availability across code, static resources, and network links, measuring failure duration, identifying typical bugs, and implementing a three‑stage assurance strategy using people processes, engineering tools, lightweight technology choices, and concrete practices such as TypeScript adoption, automated testing, health‑checks, DNS protection, and post‑incident monitoring.

MonitoringSSRavailability
0 likes · 15 min read
Front-End Service Availability: Definition, Measurement, and Assurance Practices at Meituan-Dianping Checkout
Beike Product & Technology
Beike Product & Technology
Aug 9, 2017 · Frontend Development

10 React Mini-Patterns

This article presents ten practical React mini‑patterns—including data flow, native input handling, unique ID generation, CSS control via props, component switching, autofocus, list rendering, number formatting, store usage, and import simplification—to help both newcomers and seasoned developers write cleaner, more maintainable front‑end code.

Component ArchitectureDesign PatternsReAct
0 likes · 14 min read
10 React Mini-Patterns
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 6, 2017 · Frontend Development

Mastering DOM Traversal and Sorting: Recursive & Non‑Recursive JavaScript Algorithms

This article explores how to implement recursive and non‑recursive DOM tree searches, hash‑based lookups, and several classic sorting algorithms—including quick sort and merge sort—in JavaScript, discussing their time and space complexities, stability considerations, and practical performance tips for front‑end development.

AlgorithmDOMHash Table
0 likes · 20 min read
Mastering DOM Traversal and Sorting: Recursive & Non‑Recursive JavaScript Algorithms
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 6, 2017 · Frontend Development

What Does a Front‑End Engineer Do? Roles, Skills, and Career Path

This article explains the essential role of front‑end engineers in modern software development, traces the evolution of the front‑end field, outlines the core technical stack and broader software‑engineering fundamentals, and offers practical advice on skill development, learning strategies, and career planning for aspiring front‑end professionals.

LearningSkillsWeb Development
0 likes · 15 min read
What Does a Front‑End Engineer Do? Roles, Skills, and Career Path
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 6, 2017 · Frontend Development

What’s Hot This Week in Front‑End Development? Top News & Releases

This week’s front‑end roundup covers the 2017 China Internet Top 100 ranking, WeChat’s new group mini‑program entry, Adobe’s Flash retirement, Alibaba’s open‑source Angular NG‑ZORRO library, React 16 Beta, Webpack 3.4.0, Node.js user survey results, Amazon Linux container image, Netflix Genie 3, and ContainerPilot 3.0.

NewsWeb Developmentfrontend
0 likes · 7 min read
What’s Hot This Week in Front‑End Development? Top News & Releases
Qunar Tech Salon
Qunar Tech Salon
Aug 4, 2017 · Frontend Development

Understanding and Implementing Higher-Order Components in React

This article explains the concept of higher‑order components (HOCs) in React, demonstrates basic and advanced implementations—including parameterized HOCs, display‑name handling, composition with compose, and practical examples such as loading and copy utilities—while comparing HOCs with parent components and recommending open‑source libraries.

Higher-Order ComponentJavaScriptReAct
0 likes · 10 min read
Understanding and Implementing Higher-Order Components in React
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 3, 2017 · Frontend Development

How to Build Seamless Text Scrolling for High‑Traffic Web Pages

This article reviews a high‑traffic hotel ranking marketing project and walks through three methods—marquee, jQuery carousel, and CSS3 with minimal JavaScript—to achieve seamless text scrolling, detailing HTML structure, CSS tricks for iOS acceleration, and the final jQuery script that ensures smooth, continuous animation.

css3frontendmarquee
0 likes · 4 min read
How to Build Seamless Text Scrolling for High‑Traffic Web Pages
Tencent TDS Service
Tencent TDS Service
Aug 3, 2017 · Frontend Development

How QQ Membership Achieved Near‑Instant H5 Loads on Mobile QQ

This article details the QQ Membership front‑end team's performance, componentization, and continuous‑integration practices for hybrid H5 pages on Mobile QQ, covering challenges of load speed, development efficiency, high availability, and the solutions they implemented to keep page loading around one second.

ComponentizationPerformanceautomation
0 likes · 17 min read
How QQ Membership Achieved Near‑Instant H5 Loads on Mobile QQ
Aotu Lab
Aotu Lab
Aug 3, 2017 · Frontend Development

Integrating Gitalk: A GitHub‑Based Comment System for Your Site

This guide explains what Gitalk is, outlines its key features, shows how to install it via CDN or npm, details required GitHub application settings, provides configuration options with code examples, and describes usage, rendering, contribution steps, and related projects.

GitHub IssuesGitalkJavaScript
0 likes · 6 min read
Integrating Gitalk: A GitHub‑Based Comment System for Your Site
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 30, 2017 · Frontend Development

This Week's Front‑End News: React License Drama, New npm Features, and More

A roundup of this week's front‑end highlights includes NetEase's new "Dream Werewolf" game, Apple's iPod discontinuation, Facebook Messenger 2.1 with embedded NLP, React's licensing controversy, npm 5.3.0 updates, Expo SDK v19.0.0, Angular releases, Google IPv6 stats, the Facets visualization tool, and Adobe's Flash sunset.

JavaScriptNewsWeb Development
0 likes · 6 min read
This Week's Front‑End News: React License Drama, New npm Features, and More
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 27, 2017 · Frontend Development

Master Whistle: Fast Proxy Setup for Frontend Debugging

This guide walks developers through installing Whistle, configuring one‑click proxy switching, and using its powerful rule‑based features—host mapping, file replacement, request forwarding, script injection, mock responses, remote debugging, and HTTPS support—to streamline frontend network debugging.

DebuggingNetworkWhistle
0 likes · 5 min read
Master Whistle: Fast Proxy Setup for Frontend Debugging
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 27, 2017 · Frontend Development

Create Stunning Wave Effects with Pure CSS, SVG, and Canvas

This article explains why pure CSS wave effects are challenging, demonstrates how to achieve them using SVG and Canvas, and then provides a step‑by‑step pure‑CSS technique—including border‑radius tricks, animations, and SCSS code—to build wave backgrounds and progress charts.

CSSSVGanimation
0 likes · 7 min read
Create Stunning Wave Effects with Pure CSS, SVG, and Canvas
ITFLY8 Architecture Home
ITFLY8 Architecture Home
Jul 27, 2017 · Frontend Development

How JD.com Scales Its Homepage: Frontend Architecture, Static Rendering, and Engineering Practices

This article details JD.com's front‑end architecture for its homepage, covering the challenges of massive DOM growth, static page generation via CDN, layered page loading strategies, disaster‑recovery measures, performance optimizations, and the JDF engineering toolchain that enables modular development, automated builds, and efficient deployment in a high‑traffic e‑commerce environment.

EngineeringE‑commercePerformance
0 likes · 24 min read
How JD.com Scales Its Homepage: Frontend Architecture, Static Rendering, and Engineering Practices
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 23, 2017 · Frontend Development

What’s Hot This Week in Front‑End Tech? 10 Must‑Read Updates

This weekly roundup highlights ten key developments—from the 2017 Fortune Global 500 rankings and JD.com’s logistics changes to Let’s Encrypt’s upcoming wildcard certificates, Baidu’s Vue‑based PWA solution, Webpack’s async CSS support, MobX 3.2.0, Google’s MultiModel AI, Rider IDE enhancements, Facebook’s paid‑content tools, and Google’s new search‑page news feed—providing essential insights for front‑end professionals.

AITechnology NewsWeb Development
0 likes · 6 min read
What’s Hot This Week in Front‑End Tech? 10 Must‑Read Updates
Aotu Lab
Aotu Lab
Jul 21, 2017 · Frontend Development

How We Built a Scalable Vue.js Ecosystem for JD Kids Platform

This article details the challenges of integrating dozens of APIs, complex UI interactions, and rapid multi‑version releases in a JD Kids shopping ecosystem, and explains how Vue, Vuex, Webpack, and a series of custom mixins, routing tricks, and constant management strategies were used to create a maintainable, high‑performance single‑page application.

ComponentMixinSPA
0 likes · 16 min read
How We Built a Scalable Vue.js Ecosystem for JD Kids Platform
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 20, 2017 · Frontend Development

How We Overcame Front‑End Build Chaos: Lessons from 1.0 to 3.0

The article chronicles a front‑end team's evolution from a tangled 1.0 modular setup through incremental 2.0 and 3.0 optimizations—introducing better module management, automated conflict detection, caching strategies, and build‑time reductions—to achieve a smoother, faster development and release workflow.

Build ProcessModule BundlingOptimization
0 likes · 14 min read
How We Overcame Front‑End Build Chaos: Lessons from 1.0 to 3.0
Architecture Digest
Architecture Digest
Jul 19, 2017 · Fundamentals

A Curated List of Notable Alibaba Open‑Source Projects

This article presents a comprehensive overview of prominent Alibaba open‑source projects spanning frontend frameworks, mobile cross‑platform solutions, backend systems, databases, testing tools, and UI components, each with brief descriptions and GitHub links for developers seeking robust, enterprise‑grade resources.

AlibabaDevToolsbackend
0 likes · 13 min read
A Curated List of Notable Alibaba Open‑Source Projects
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 16, 2017 · Frontend Development

Top Front-End & Tech News This Week: Vue PWA, Async CSS, MobX 3.2, and More

This week’s front‑end roundup covers Baidu’s new Vue‑based PWA LAVAS and Web AR support, a decline in global PC shipments, Taobao’s group‑buy launch, upcoming async CSS in Webpack, MobX 3.2.0, China’s first smart parking system, Apple’s open‑sourced Swift Migrator, Let’s Encrypt wildcard certificates, Facebook camera updates, and Huawei’s 5G trial talks with India.

AIMobXVue
0 likes · 6 min read
Top Front-End & Tech News This Week: Vue PWA, Async CSS, MobX 3.2, and More
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 9, 2017 · Frontend Development

This Week’s Front‑End Highlights: Java 9 Modules, TypeScript 2.4, Node 8.1.3 & More

The weekly roundup covers the latest front‑end and web tech news, including game‑regulation debates, Java 9 module system approval, TypeScript 2.4 and Node 8.1.3 releases, Preact CLI updates, MDN’s new focus, Twitter Lite PWA results, major corporate acquisitions, Google Blocks VR tool and Huawei’s borderless computing server strategy.

Technology NewsTypeScriptWeb Development
0 likes · 7 min read
This Week’s Front‑End Highlights: Java 9 Modules, TypeScript 2.4, Node 8.1.3 & More
Aotu Lab
Aotu Lab
Jul 7, 2017 · Frontend Development

Build a Simple Motion Detection Demo with WebRTC and Canvas

This guide explains how to create a lightweight motion‑detection effect in a web page using WebRTC to capture video, Canvas for pixel processing, and JavaScript algorithms that compare consecutive frames, apply brightness thresholds, and optionally track moving objects with bounding boxes.

JavaScriptMotion DetectionPixel Processing
0 likes · 12 min read
Build a Simple Motion Detection Demo with WebRTC and Canvas
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 6, 2017 · Frontend Development

Fix Mobile Photo Rotation Issues with EXIF and Canvas

This article explains how to detect the EXIF Orientation tag on mobile‑captured photos, rotate them correctly with canvas, and compress the result to reduce size, providing a lightweight solution for fixing 90° rotation issues on iPhone and certain Android devices.

CanvasEXIFImage Rotation
0 likes · 5 min read
Fix Mobile Photo Rotation Issues with EXIF and Canvas
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 5, 2017 · Frontend Development

Mastering CSS conic-gradient: From Basics to Stunning Visual Effects

Explore the CSS conic-gradient function in depth—its syntax, differences from linear and radial gradients, practical examples like color wheels, pie charts, animated backgrounds, and polyfill support—while learning how to combine percentages, background-size, and blend modes to create dynamic, cross-browser visual designs.

CSSPolyfillanimation
0 likes · 10 min read
Mastering CSS conic-gradient: From Basics to Stunning Visual Effects
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 5, 2017 · Frontend Development

How to Navigate a Front‑End Engineer’s Career: From Rookie to Leader

This article shares a five‑year front‑end engineering journey divided into three phases—rapid early learning, broad mid‑career knowledge expansion, and senior‑level role decisions—offering practical advice on skill development, architecture, community involvement, and choosing between technical depth and management.

LeadershipLearningfrontend
0 likes · 6 min read
How to Navigate a Front‑End Engineer’s Career: From Rookie to Leader
21CTO
21CTO
Jul 2, 2017 · Fundamentals

Essential Regex Cheat Sheet: 20 Common Validation Patterns for Developers

This cheat sheet compiles twenty practical regular‑expression patterns—including date, password, email, ID, IP, URL, and HTML validation examples—along with JavaScript snippets, giving developers a quick reference to boost input‑checking efficiency across front‑end and back‑end projects.

JavaScriptPattern MatchingValidation
0 likes · 8 min read
Essential Regex Cheat Sheet: 20 Common Validation Patterns for Developers