THE GREAT CONSOLIDATION:ENTERTAINMENT WEEKLYMIGRATION CASE STUDYJON PECK, MATT GRILL, PRESTON SO

S l i d e s : h t t p : / / g o o . g l / q J i 8 K l

WHO ARE WE?

Jon Peck - Matt Grill - Preston So -

drupal.org/u/fluxsaucedrupal.org/u/drpal

drupal.org/u/prestonso

PROJECTOVERVIEW

WHAT   D I D  WE   DO   &  WHO   D I D   I T ?Jon

ENTERTAINMENTWEEKLY

Entertainment newsmagazine40th largest in the USew.com serves 13.7million consumersper week

Front page of EW.com

MIGRATIONSCOPE

WORDPRESS10 blogs51,616 terms101,581 posts90,435 images

VIGNETTE V6117,326 articles201,986 images97,611 terms4,924 galleries

DEVELOPMENTTEAMS

Four Kitchens - 3 to 6 developersTime Inc. - 1 to 4 developersZoom, HipChat for regular communicationVideo really helpsGitHub Selfies - improved moralegoo.gl/KrtRur

TIMELINE

First commit: April 29th, 2014Launch: January 29th, 201517 sprints

DELEGATION OFRESPONSIBILITIE

SFOURKITCHENS

TIME INC.

Project ManagementData structuresMigrationImplement design,advertising

Product OwnerDesignWorkflowInfrastructure, buildprocess

PROCESSS T ANDARDS   A ND   DOCUMEN T A T I ON

Preston

DEFINITION OFREADINESS ANDCOMPLETION

Stakeholders: Context necessary for developmentDevelopers: Reviews, PO acceptance, demo, docsEvolving framework

CODE AND STYLESTANDARDSALGORITHMICALLY

ENFORCED with Drupal rules from

syntax and errors code style

settings

PHP_CodeSniffer coderjshintjscsEditorConfig

COMMIT ANDPULL REQUESTWORKFLOW

Descriptive commit messagesRobust testing instructionsPull request labels

PEER CODEREVIEWS

CODE REVIEW: DOES IT...Pass code and style standards?Accomplish the task gracefully?Perform at an optimal level?

PEER CODEREVIEWS

FUNCTIONAL REVIEW:DOES IT...

Fulfill the intent of the story?Use best practices?Avoid technical debt?

DEVELOPMENTENVIRONMENTS

Documented project-specific processGreatly reduced on-boarding timeProvided detailed feedback

BRANCHINGSTANDARD

Reduces clutter, helps manage releasesImproves communication, navigationsprint-XX (kept for one sprint)PROJECT-YY (deleted after merge)Tags added when deleting sprint branch

FRONT­ENDT HEM I NG ,   P E R FORMANCE   A ND

ADVER T I S I NGMatt

AURORA, MOBILEFIRST THEMING

Separate themes hard requirementEdge device detection set cookietheme_key switched theme using cookieUsed Aurora as base themeHTML5, Sass & CompassMobile theme is sub-theme of AuroraDesktop is a sub-theme of Mobile

GULP TASKMANAGEMENT

Compiles SassRuns JavaScriptcheckersWatches for changes

JAVASCRIPTGLOBAL SCOPING

Created global JSobject for all EWfunctionsCentralized point ofentryEasy access

ATOMICJAVASCRIPT

FUNCTIONALITY

Break relatedfunctions intoindividual filesOnly load what’sneededImproves front-endperformance

PRE­PROCESSING

Node template data built in pre-processingClean & reusableHelper and abstractions

GLOBALMETADATAOBJECT

Useful for integrations requiring metadataAvoids repetitionFacilitates data collection by crawlers

BEACONPERFORMANCE

Delay loading of beacons (non-blocking/defer)Use defer for injecting JS tags

ADPERFORMANCE

No ad specific logic in templatesData attributes contain relevant valuesAvoids inline JSAds process and render in footer (after page load)

EDITORIAL UI &WORKFLOW

Preston

PACKAGES ANDCHANNELS

Automatic dynamic contentEditors define rules for selectionOptional manual curation

CUSTOMCONTENT TYPES

Used existing TI features to beginRounds of PO, editor feedbackUsability key to adoption

DYNAMIC ENTITYREFERENCES

Many aggregate viewsEditorial control of views, but with overridesCustom module that "fills in" empty parts of aview based on contextView lists 15, editor defines 5, DER populatesremaining

DYNAMIC ERCHALLENGES

Modular, extensible, reusableAccurate dynamically curated nodesHigh performanceEditorial expectations for cachingState Machine integration

CONTENTMIGRATIONS

WORDPRESS ,   V I G N E T T E   T O   D RUPA LJon

WORDPRESSCHALLENGES

10 different blogs, structures, taxonomiesInvalid markupCustom shortcodes, filters

WORDPRESS_MIGRATE NOT ENOUGH...

BUT STILL USEFUL!Extended classesHelped normalize WXR structure (really just XML)Focus on custom logic

WORDPRESSPRE­PROCESSING

Stripped commentsTransformed identifiersSeparated authors, images, tags

WORDPRESSSHORTCODES,

FILTERSImplemented subset of shortcodes in DrupalMost not migratedRendered as HTML in pre-processingUsed WordPress libraries, existing codeFaked WordPress bootstrap to execute natively

MAPPINGWORDPRESS

TAGS ON IMPORTSpecific vocabulariesNew content types (People, Creative Works)CSV Spreadsheet used for defining rules

EXPORTING FROMVIGNETTE

Rendered as XML filesMost procs were rendered as HTMLTransformed overloaded taxonomies to content

IMPROVINGMIGRATION

PERFORMANCEValidate all XML before ingestionEliminate all PHP errors, warningsAvoid redundant migrationsUse cache_counts

REDUCINGMIGRATIONOVERHEAD

Disabled solr, pathauto, metatag, othersduring migrationIndexing lookup tablesRan migrations in parallelEnsure HW resources are sufficient

REDIRECTSTRATEGYMinimize Drupal performing redirectsRedirect farm (rules, 1:1 redirects)DNS changesRedirects from migrated servers

PERFORMANCEAND CACHING

Matt

FRONTENDPERFORMANCE

CSS is Sass and Compass optimizedTargeted - only load needed CSSJavaScript is linted, strict standardsJS in the footer (non-blocking)

FRONTENDCACHINGSTRATEGYEditorial 1 minute publish to liveEnsure cacheable headers are setShorter TTL on Akamai than VarnishSend purges on publishing

BACKENDPERFORMANCE

Eliminate PHP errorsCache, EXPLAIN custom queriesMinimize unnecessary overheadModule countBenchmarking

PERFORMANCETESTING

Load test production with migrated dataBlitz.io and custom toolingNew Relic for introspectionExercised different content types, exceeded TTLsWebPageTest.org

WHAT DID YOU THINK?EVALUATE THIS SESSION ON

events.drupal.org

THANK YOU! @fluxsauce @alwaysworking @prestonso