The Future of Style aggregates posts from various blogs that
talk about the development ofCascading Style Sheets (CSS) [not
development with Cascading Style Sheets]. While it is
hosted by the W3C CSS
Working Group, the content of the individual entries represent
only the opinion of their respective authors and does not
reflect the position of the CSS Working Group or the
W3C.
This CSS module describes the contain property, which indicates
that the element’s subtree is independent of the rest of the page.
This enables heavy optimizations by user agents when used well.
This is the first CR of this drafts. Implementations are
encouraged, and feedback based on them much welcome. In particular,
comments about interaction with other specifications would be very
welcome, and you find desirable optimization opportunities that
this technology fails to facilitate, the CSSWG would like to hear
from you.
Please send feedback by either filing an issue in
GitHub (preferable) or sending mail to the (archived)
public mailing list [email protected] with the spec code
([css-contain]) and your comment topic in the subject
line. (Alternatively, you can email one of the editors and ask them
to forward your comment.)
The CSS Working Group has published updated Working Drafts of
CSS Fonts Level 4.
This module defines new features regarding variable fonts, font
loading timeline configuration, and color fonts support.
Please send feedback by either filing an issue in
GitHub (preferable) or sending mail to the (archived)
public mailing list [email protected] with the spec code
([css-fonts]) and your comment topic in the
subject line. (Alternatively, you can email one of the editors and
ask them to forward your comment.)
New Candidate Recommendation: CSS Containment
Level 1.
fantasai pulled a list of open Align issues to ensure
they’re discussed.
Bert reported that he’s done enough work on CSS 2 so that a
discussion on how to manage it going forward can be added to the
F2F agenda.
Resolved: Option #1 from the Issue #1612
“Reduce the size of the alignment container by the size of the
float’s margin box, then center the block in the remaining space
(this is the behavior of HTML’s align attribute)”
Resolved: Such alignments that overflow will not
participate in last baseline alignment (Issue
#1556)
fantasai requested review on the text changes added to the spec
to address Issue #1609:
Intrinsic Size of Images with Intrinsic Aspect Ratio and No
Size
She also mentioned that Issue #951
(Define sizing of SVG Boxes with intrinsic aspect-ratio but no
intrinsic size, in an auto-sized shrink-wrap parent) is on the F2F
agenda for discussion so people can think about it in advance.
AmeliaBR noted that many of these cases have been addressed in SVG
so referring to that spec should be useful in this
conversation.
Resolved: Accept the edits proposed in Issue
#1295
Adobe has announced it will stop distributing and updating
Flash Player at the end of 2020 and is encouraging web developers
to migrate any existing Flash content to open standards. Apple is
working with Adobe, industry partners, and developers to complete
this transition.
Apple users have been experiencing the web without Flash for
some time. iPhone, iPad, and iPod touch never supported Flash. For
the Mac, the transition from Flash began in 2010 when Flash was no
longer pre-installed. Today, if users install Flash, it remains off
by default. Safari requires explicit
approval on each website before running the Flash plugin.
To display rich interactive content in the browser, WebKit—the
engine that powers Safari—supports the latest standards, including
the following:
HTML Video and Media Source Extensions support a wide range of
video experiences, including short clips, longer content, and live
streaming.
HTML Canvas and WebGL provide fast, dynamic graphics for games
and interactive experiences.
CSS Transitions and Animations add polished animations to web
interfaces.
WebRTC enables real-time peer-to-peer video.
WebAssembly allows games and other compute-intensive
applications to run faster.
The WebKit Project is excited about the future of the open web.
We invite you to follow this blog to learn about new technologies
as they’re implemented in WebKit.
Safari Technology Preview Release 36 is now available for download for
macOS Sierra and betas of macOS High Sierra. If you already have
Safari Technology Preview installed, you can update from the Mac
App Store’s Updates tab. This release covers WebKit revisions
219131-219567.
The CSS Working Group has published updated Working Drafts of
Motion Path Level
1. Motion Path Level 1
describes how graphical object is positioned and animated along an
author specified path.
Most of the changes are influenced by merging some features from
CSS Round
Display. A list of significant changes can be found in Changes section.
Please send feedback by either filing an issue in
GitHub (preferable) or sending mail to the (archived)
public mailing list [email protected] with the spec code ([motion-1]
and your comment topic in the subject line. (Alternatively, you can
email one of the editors and ask them to forward your comment.)
Updated Working Drafts of CSS Box Alignment and CSS Display
Level 3
The CSS Working Group has published updated Working Drafts of
CSS Box Alignment Level
3 and CSS Display
Level 3. CSS Box
Alignment Level 3 contains the features of CSS relating to the
alignment of boxes within their containers in the various CSS box
layout models (block, flexbox, grid, tables). CSS Display Level 3
describes how the CSS formatting box tree is generated from the
document element tree and defines properties that control the types
of boxes thus generated.
As we are wrapping up work on these specs in preparation for CR,
most of the changes are fairly minor fixes and clarifications. A
list of significant changes can be found in their respective
Changessections.
Please send feedback by either filing an issue in
GitHub (preferable) or sending mail to the (archived)
public mailing list [email protected] with the spec code ([css-align]
or [css-display]) and your comment topic in the
subject line. (Alternatively, you can email one of the editors and
ask them to forward your comment.)
Anyone with interest was asked to respond to the request
for review from the TTML working group.
fantasai will reply to Chris shortly in order to resolve if
Writing
Modes needs one more CR cycle.
gregwhitworth began reviewing all the Flexbox tests to
establish coverage.
The group discussed how to continue moving CSS2 publications
forward:
Though the group recorded several resolutions in February to
change the CSS2 publication process (recorded here)
the new process still hadn’t been fully implemented. This has lead
to there being greater confusion as to what is the most up to date
and possibly new work occurring in more than one place.
There was some concern that this new process was either not the
best way forward or not well understood, so there will be a
conversation at the Paris F2F to revisit the original
decision.
In order to reduce confusion as to what is currently out there,
Bert will look through css-testing and make sure that any changes
there are merged into css22 before deleting css-testing as well as
css-source (which is currently empty).
There were three items
listed in github for the group to choose from to resolve the
compatible alignments not always being compatible issue.
Exclude items with align-self: stretch and a
specified height constraint (min-height/height/max-height) from
align-content: last baseline alignment.
Exclude items with align-self: stretch whose
specified height constraint gets triggered such that it no longer
sizes as stretch.
Treat items with align-self: stretch and
align-content: last baseline as having an end fallback
alignment instead of a start fallback alignment.
Safari Technology Preview Release 35 is now available for download for
macOS Sierra and betas of macOS High Sierra. If you already have
Safari Technology Preview installed, you can update from the Mac
App Store’s Updates tab. This release covers WebKit revisions
218629-219131.
Performance
Fixed a 50% regression on MotionMark Suites when extended color
support was added (r218717)
Fixed the bug that Speedometer’s score worsens by 40% when
accessibility features are enabled (r218910)
Media
Changed image decoding so that when an image appears more than
once on a page, decoding to paint one instance repaints them all
(r219045)
Fixed a frame rate issue that caused getUserMedia
to fail on some machines (r218852)
Fixed allowing media element to update its state when Mission
Control closes the fullscreen window (r218813)
Made a change to hide volume controls when AirPlay is active
(r218891)
Prevented capturing at unconventional resolutions when using
the software encoder (r218699)
Prevented clearing capture mute from clearing audio mute
(r218632)
Web Inspector
Added a small delay before showing the progress spinner when
loading resources (r219017)
Added a toggle button to the left side of the split console
navigation bar (r218839)
Fixed initial search sometimes being performed twice, producing
duplicate results (r219021)
Fixed slowness when pausing with a deep call stack by avoiding
eagerly generating object previews (r218718)
Flipped all go-to-arrow instances in right-to-left mode
(r218777)
Fixed script timeline bubbles that sometimes appear to miss
large events (r218781)
Fixed a hang when using “break on all exceptions” throws a
stack overflow (r218652)
Improved type token background color in the debugger (r219041)
JavaScript
Cleaned up Object.entries implementation (r218790)
Conversation around alias “nowrap” as “no-wrap” started with
the three options the topic had previously narrowed down to:
No change at all
Add dashed version as a parse-time alias
Add dashed version as a new values that behaves the same as
nowrap
The group was divided on if the change was a good idea so
conversation mostly focused on option 1 vs either 2 or 3. There was
very little interest to implement the change quickly or at all from
vendors so it was decided to close this for now and let the
advocates see if they can convince anyone else of the need.
Resolved: No change for issue about adding no-wrap
The group did some on the call test cases that showed there
wasn’t currently any interop on computed value of a negative calc
unit. birtles brought up some concerns around Animations that
needed further consideration before a decision is reached.
Discussion will continue on github.
Resolved: trim white space before / after property value
in a declaration.
Resolved: New Values boilerplate
language accepted.
There was no one strongly championing the gradients with a
single color stop proposal, so
it will stay out of the spec until it finds an advocate.
We’re going back to Respond 16 for our Video
of the Week this week, when Sara Soueidan came to visit and
delivered an inspiring, eye-opening keynote presentation on what
can be done with CSS and SVG working together.
It’s an excellent talk, and really needs no more introduction
than that.
Want more?
Like to see and read more like this? Be the first to score
invitations to our events? Then jump on our once-a-week mailing
list to keep up with everything happening at Web Directions. And
you’ll get a complimentary digital copy of Scroll magazine.
Rossen will confirm if Writing Modes
needs a CR publication before the PR request.
Variables
needs to republished after the tests are approved.
Resolved: make “disc” not overridable.
Resolved: adopt inset as the new positioning property
name that’s used for shorthand
fremy will create a poll with a description and diagrams to
evaluate if inset is preferable over some of the other top
options.
Resolved: leave behavior as-is and not accept ‘legacy’
values for ‘place-items’.
Resolved: accept the proposal that margin and position
properties will return the specified values.
Resolved: the baseline alignment in block direction of
tables is not defined. Also add a note prompting implementors to
bring back ideas if they have any.
Resolved: leave the ‘left’ and ‘right’ values to
fallback to start.
Resolved: remove left and right from align-self and
align-content in align L3.
birtles gave a brief introduction to issue 1301
(reconsider name of frames() timing function) in hopes
of getting more discussion before next week’s call.
Safari Technology Preview Release 34 is now available for download for
macOS Sierra and betas of macOS High Sierra. If you already have
Safari Technology Preview installed, you can update from the Mac
App Store’s Updates tab. This release covers WebKit revisions
217978-218629.
WebRTC
Added WebRTC options to the Developer menu
Disabled Legacy WebRTC API in the Experimental Features menu by
default (r218169)
Changed behavior to close NetworkProcess WebRTC sockets as soon
as the Web Process no longer needs them (r218432)
Added support for receive-only SDP offers through
addTransceiver (r218431)
Changed handling capture status based on MediaStreamTrack
(r218399)
Changed RTCPeerConnection to return RTCSessionDescriptionInit
instead of RTCSessionDescription (r218335)
Fixed a cloned MediaStreamTrack to not mute the other tracks
using the same source (r218497)
Fixed RTCPeerConnection getReceivers() to return
transceivers that have an active receiver but no active sender
(r218182)
Fixed the screen going into sleep mode during WebRTC video
(r218151)
Media
Fixed high CPU usage when entering fullscreen or seeking during
MSE video playback (r218463)
Fixed seeking during MSE video playback where audio would begin
playing long before rendering the video (r218150)
Fixed video flashing black when switching back to a tab
(r218291)
Improved media controls rendering for long-loading media files
(r218600)
Prevented media elements continuing to load media data after
navigation (r218016)
JavaScript
Made Object.assign faster by rewriting it in C++
(r218348)
Resolved: Columns are properties applied to block
containers only.
Those arguing in favor of the proposed alias of “nowrap” as
“no-wrap” did so for author usability. However, the argument
against the alias is that it adds weight to the API and sets a
precedent for doing this again in the future. The two sides
couldn’t agree within the time of the call so the topic was
deferred back to github.
Opera 46 (based on Chromium 59) for Mac, Windows, Linux is out! To
find out what’s new for users, see our
Desktop blog post. Here’s what it means for web developers.
Animated PNG
Opera now supports animated PNG, or APNG for short. APNG is a
file format that works similarly to GIF. The difference is that
APNG is smaller and supports both 24-bit images and 8-bit
transparency. It has become quite popular recently, particularly
since Apple adopted the APNG file format for
the iOS 10 iMessage apps. APNG was also supported in
Presto-based Opera 12.
This was actually added in Opera 44, but we missed to write
about it!
This might still be a bit rough in the edges, but in general SVG
favicons should now work in Opera! (Not
yet in Chromium.) To see this in action, check some of the
WHATWG standards which use
SVG favicons. Firefox also supports SVG
favicons, and it was also supported in Presto-based Opera 12.
Expensive background
tab throttling
Opera now throttles expensive background tabs. This reduces the
processing power required for background tabs and improves battery
life and browsing performance. Try it out yourself with this
background
timer throttling demo.
As a web developer, you also can help with reducing the work
that your page or app does while being in a background tab by using
requestAnimationFrame instead of timers to drive
animations, and the
Page Visibility API to stop unnecessary work when the page is
hidden.
Developers can now use MediaError’s message property to
obtain greater detail about a MediaError produced by
<audio> or <video>.
WritableStreams
are now available as part of the Streams API for processing
streams of data, while providing a standard abstraction for writing
streaming data to a sink with built-in backpressure
and queuing.
The Image
Capture API now allows sites to take higher resolution images
than before, providing full control over camera settings such as
zoom, ISO, and white balance.
To provide enhanced privacy, CSS stylesheets can now specify
their own referrer
policy via the HTTP header, rather than always inheriting the
referrer policy of the document that originally referenced it.
Touch
events are now aligned to requestAnimationFrame, ensuring that input is
processed as part of the document lifecycle and creating a more
efficient and adaptive input response.
The <dialog> element has changed from
display: inline to block by default to better align with the
spec.
Following
removal from the Media Queries spec,
support for hover: on-demand and any-hover:
on-demand media queries have been removed.
To better align with spec and help avoid race conditions,
decodeAudioData now detaches the given ArrayBuffer
before decoding, removing all content from the object and making it
unable to be reused or examined.
The -internal-media-controls-cast-button CSS
selector has been removed in favor of the Remote Playback
API.
The -internal-media-controls-text-track-list* CSS
selectors have been removed in favor of custom-built video
controls.
The SVGTests.requiredFeatures attribute has been
removed following its removal from the
spec.
initDeviceMotionEvent() and
initDeviceOrientationEvent() were removed in favor of
DeviceOrientationEvent()
and DeviceMotionEvent(), following a spec trend of
moving away from initialization functions and toward
constructors.
To preserve consistency across browsers, the
sample property will now be included in a
violation report (and associated SecurityPolicyViolationEvent
object) if a report-sample expression is present in
the violated directive.
To increase security, Opera will now block requests for
subresources that contain embedded credentials, and instead handle
them as network errors.
To increase security, Opera will now block requests from
HTTP/HTTPS documents to ftp: URLs.
To preserve consistency across browsers, injecting JavaScript
via AppleScript is longer supported in Opera for Mac.
The ability to call
Notification.requestPermission() from non-main frames
has been deprecated to align the requirements for notification
permission with requirements for push notifications, and ease
friction for developers.
Support for Shared Dictionary Compression (SDCH) has been
disabled until a stable API has been standardized.
What’s next?
If you’re interested in experimenting with features that are in
the pipeline for future versions of Opera, we recommend following
our Opera Developer
stream.
Running in conjunction with our long standing, highly
regarded Code
Conference for front end engineers and JavaScript
developers, Code Leaders focuses on what senior
engineering decision makers need to know about right now.
As the things we build and the teams and organisations that
build them become ever more complex, technical knowledge and
capabilities simply aren’t enough. Code
Leaders is designed for engineering and development
leaders, senior developers, lead engineers, engineering managers,
CTOs.
It doesn’t matter so much what your role is called, if you’re
responsible for building and leading teams, and making strategic
decisions about the technologies your company or organisations
uses, Code Leaders is designed for
you.
Code Leaders takes place over a single,
intensive day, and features real world experts addressing key
challenges of technology, leadership and developing, maintaining
and growing great engineering teams.
In this session, we’ll look at the current state, and near term
developments of the core technologies of the web: JavaScript, HTML,
CSS, SVG and the browser’s APIs, from two of the world’s leading
experts.
JavaScript: Now and Next: Brian
Terlson
Where is JavaScript at right now, in 2017? And where is it
headed in the near future? What changes will most impact the way
you work in the coming years? How can you get involved in the
process?
The State of Front End Technologies: Chris
Lilley
In our era of Web Apps, where JavaScript seems paramount, the
core technologies of the web: HTML, CSS, SVG, and the browser’s DOM
APIs still very much have a place when developing for the web.
Chris Lilley gives us a sense of what’s coming for the foundations
of the web platform.
Session 2: Best Practice
In this session, we’ll look at how networks impact performance,
and security, and the architecture of Web Apps, again with two
world leaders in these fields.
The Changing Face of Loading
Resources: Andrew Betts
The underlying transport mechanisms of the web, including HTTP
and TCP are being overhauled. This session looks at the evolution
of these largely out-of-sight but incredibly important
protocols, with huge implications for performance and security for
today’s web.
Modern Web App Architectures: Zero Cho
What is the architecture of complex Web Apps? Few apps work at
the scale of Twitter, with hundreds of millions of users, and
billions of messages a month. Hear about
the architecture, and lessons learned building Twitter
Lite.
Session 3: Culture
This session turns to the challenges that face senior
engineering professionals and management: people, and ensuring the
best from and for them. We draw on the experience of experts
in building more diverse, inclusive, highly performing teams.
Re-imagining the Hiring Process: Elle
Meredith & Lachlan Hardy
We’ve all been on the other side of the table. A laundry list of
required technologies and practices, white boarding code, logic
puzzles, folks “hiring for culture fit”. But do these practices
ensure the best possible hires, and ultimately the best performing
teams?
Designing a Culture that Fosters
Growth: Josh Duck
In this session Josh, now back in Australia managing a team at
the ABC, shares lessons he learned working for Facebook, renowned
for both its engineering prowess and also growing its engineering
head count at an almost unimaginable rate over the last decade.
That’s quite a day.
Now, we’ve deliberately limited numbers for
Code Leaders to ensure the greatest opportunity for
participants to connect with one another, our leaders and invited
experts. It’s a day for minimum screen time, and maximum connection
and communication.
During the day you’ll be seated with a group of fellow
participants with a balance of experience as leaders. Each table
will have a facilitator, someone with significant industry
experience, and will have the opportunity to put questions to our
expert speakers.
Throughout the day there’ll be the opportunity for every
participant to develop their leadership abilities by facilitating
post-briefing discussion among your group.
You’ll also get the opportunity to connect with our leaders and
invited experts during the day.
This is a new event, we’ve kept our prices low, and we do
encourage you to register early. Given the number of tickets we’ve
already sold, it is likely that this event will sell out.
If you’re in the business of leading or managing teams of
engineers and developers – or you’d like to get to that kind of
position – do not miss
Code Leaders.
16 Jun
2017 The 2017 edition of the CSS Day will take place on the 16th of
June (in Amsterdam). Speakers include Tab Atkins, Jen Simmons,
Rachel Andrew, Håkon Wium Lie and Bert Bos.
Håkon Wium Lie will talk about ‘CSS in print’ and Bert Bos
a…
15 Jun
2017 Håkon Wium Lie will talk about ‘CSS in print’ and Bert
Bos about ‘CSS Grid’ at the CWI in Amsterdam on the 15th of June.
Registration required.
Safari Technology Preview Release 33 is now available for download for
macOS Sierra and betas of macOS High Sierra. If you already have
Safari Technology Preview installed, you can update from the Mac
App Store’s Updates tab. This release covers WebKit revisions
217407-217978.
Performance
Fixed an issue that could lead to large memory use in the
Safari Technology Preview and web content processes when certain
Safari Extensions are installed
JavaScript
Fixed for-in optimization static analysis in the
bytecode generator (r217438)
Improved performance of String.prototype.concat
(r217648)
Improved the bytecode and type information provided for
toLength (r217530)
Please send feedback by either filing an issue in
GitHub (preferable) or sending mail to the (archived)
public mailing list [email protected] with the spec code
([css-overflow-4]) and your comment topic in the
subject line. (Alternatively, you can email one of the editors and
ask them to forward your comment.)
Here, at last, is the full program
for Web
Directions Code 17, taking place in
Melbourne on 3-4 August.
Let me tell you, a fair bit of thinking went into this.
Getting the participation of some of the world’s (and Australia’s)
leading thinkers and doers in front end engineering is one thing –
turning that into a two day event with a coherent structure is
another altogether.
It’s not the kind of opportunity you want to waste – after all,
it’s not like these seven international keynote
speakers come here to Australia on a regular basis. For
that matter, it’s not like our frankly impressive array of
local experts can often be found together in the
same place, either.
So, it’s important we give all of these speakers an opportunity
to shine, and all the attendees the chance to take it all in,
digest it and see how they can apply it to their own work. Because
that’s our goal: to give you insights that help you do your job
better.
As always, we have a great offer for past attendees of our
events, you can find the details further down.
Here we go.
Day One.
Mavo: HTML re-imagined for the era of Web Apps Lea
Verou
In an age when it seems everything is developed in JavaScript,
using frameworks like Angular and React, what place is there for
old fashioned HTML and CSS? Say hello to Mavo.
The State of JavaScript in 2017 Brian
Terlson
The landscape of JavaScript seems to be in constant flux. Not just
the frameworks and build tools we use, but the very language itself
now that new versions are being released annually. But where is it
at right now, in 2017? And where is it headed in the near
future?
No More Awaiting for Async Functions Erin
Zimmer
Dealing with asynchronous functions has been a bit of a problem
since the early days of JavaScript. Promises help a bit, but
they’re still limited in some ways. Async functions make writing
async code simpler, and let you do some things that aren’t so easy
with promises.
Modules in Motion Damon
Oehlman
Modularity in web application code has been a topic of much
discussion for a long, long time. Implementing solutions that
provide a useful approach have consumed many development hours. We
are converging on a single solution now in the form of ES6
modules.
It’s Time to Talk About Type Checkers Ben
Teese
Static type checkers have been a part of the JavaScript ecosystem
for many years now, and with Microsoft, Google and Facebook all
having made major investments in tools like TypeScript and Flow,
it’s probably fair to say that type checkers are here to stay.
Developing
the Twitter PWA Zero
Cho
The most recent version of Twitter’s web app, Twitter Lite, was
recently released. It’s a Progressive Web App, which is fast and
responsive, uses less data, takes up less storage space, and
supports push notifications and offline use in modern browsers.
Preact: Into the Void 0 Jason
Miller
Grab a hard hat and follow me down into the internals of Preact, a
tiny 3kb alternative to React. Along the way we’ll shed light on
fundamentals like JSX & Virtual DOM, demystify DOM diffing, and
see how keys work up-close.
The State of Web Fonts Chris
Lilley
With CSS Level 3 OpenType font features, the widely adopted WOFF
format, Chromatic Fonts, and more recently OpenType variable fonts
– a single font file that behaves like multiple fonts – the
capabilities opening up for typography on the web are
extraordinary.
Phew! That’s Day One: five international
keynotes + three locals. Now brace yourself for Day
Two.
The Power of the Network Andrew
Betts
Web developers are increasingly responsible for the performance of
the sites they build, and there is now a plethora of advanced tools
and services that allow developers to hone front end
performance as never before. But the network can still be
your biggest bottleneck.
The Road to Styled Components: CSS in Component-based
Systems Glen
Maddern
Building user interfaces on the web is hard, because the web, and
thus CSS, was inherently made for documents. Because UIs
fundamentally are not documents, we’ve seen a mindset shift towards
building component-based systems.
A Unified Styling Language Mark
Dalgleish
In the past few years, we’ve witnessed a massive increase in the
amount of CSS experimentation, with ideas like CSS Modules and,
controversially, the rise of CSS-in-JS. But does mixing our styles
and logic run counter to the original ideas of CSS? Does it break
progressive enhancement?
Traditional CSS at Scale(?) Mandy
Michael
When the team at Seven West Media redeveloped The West Australian’s
digital platform in a tight 4-month deadline, they embraced the CSS
they know and love with a component driven approach. The lessons
Mandy learned have led her to the ultimate question: is there a
better way?
CSS Architectures Q&A MC:
John Allsopp
Having heard from three of our industry’s leading front end
developers, let’s dive with them into the current and future state
of CSS architectures. You can help us get to the heart of one of
the front end’s most pressing challenges: how do we work with style
in today’s complex web creations?
Artificial Intelligence 101
Patrick Catanzariti
Every industry will be affected by AI, machine learning and voice
interfaces in the coming years. Terms like “neural networks” and
“deep learning” often sound complicated and sci-fi, but there are
platforms and technologies out there today that can enable you to
do a whole lot out of the box.
CSS: Current, Soon, Someday
Charlotte Jackson
Thanks to progressive enhancement, we can make use of many new CSS
features, even though not browsers support them. We’ll look at
examples of CSS that we can use now and what we can use with care.
And it’s not all about using new CSS; we can all play a part in its
development too.
Using the Web Payments API Marcos
Caceres
In this session, Mozilla’s Marcos Caceres will provide an overview
of the emerging Payment Request and Payment Response browser APIs
and how to integrate them into existing HTML forms.
Choosing
Your Animation Adventure Val
Head
Animation has come a long way on the modern web and now we have a
long list of choices for how to make things move on screen: CSS,
JavaScript, SVG, the Web Animation API. With so many options, how
can you be sure which is the best choice for your project?
It’s hard to know what to get more excited about: seven
international speakers, 10 locals, all the topics firing front end
devs and engineers around the world and a unique Q&A session
where you get to pick the brains of three of our leading code
specialists.
That’s probably enough to set your brain spinning at this
stage, although we’ll tell you more about what we have lined up in
coming weeks, including a few special surprises. Don’t wait for
that to book your tickets, though.
We’ve already sold about 33% of the registrations we
have available, and we’re still more than two weeks out
from the close of our Early Bird offers.
Here it is. The speaker line-up you’ve been waiting for. We’ve
literally just confirmed our final speakers, so it’ll take another
couple of days before the Code website has all the details, but
here’s who’s speaking.
Chris
Lilley: The first chair of the CSS Working Group and
co-editor of the CSS 2 specification, the inaugural chair of the
SVG Working Group and now a Technical Director at W3C.
Lea Verou: Lea is
well known as a highly engaging speaker on all things front end,
the author of CSS Secrets, a long standing member of the CSS
Working Group, and has spoken at Web Directions events on several
continents.
Brian Terlson:
Brian, editor of the JavaScript standard, and implementor of the
JavaScript engine in the Edge browser will bring us up to date with
the current state of JavaScript, as well as where we’ll see it head
next.
Val Head: Val
will survey the full spectrum of animation options from CSS to
React Motion and show which are best suited for things like state
transitions, showing data, animating illustrations, or making
animations responsive.
Jason
Miller: Prolific JavaScript developer, architect
and Open Sourcerer, the author of Preact, Jason will take us deep
into modern browser internals, learning performance and
optimisation secrets along the way.
Zero
Cho: Zero will give us a sense of the
architecture of Twitter Lite, the technologies used, and lessons
learned in building the Progressive Web App version of one of the
world’s most widely used web services.
Andrew
Betts: Andrew is a web developer and principal
developer advocate for Fastly, and is also an elected member of the
W3C Technical Architecture Group, a committee that guides the
development of the World Wide Web. Andrew will be talking about the
power of the network.
Erin
Zimmer: Erin has been a Senior Front-end
Developer on the new DigitaliD project at Australia Post for the
last year, after 10 years as a web developer for the federal
government in Canberra.
Damon
Oehlman: Damon is a web application developer who
has worked on geospatial applications, WebRTC and now enjoys
working on Canva. For a long time he has searched for the one
module system to rule them all.
Ben
Teese: Ben is a senior developer and consultant
for Shine Solutions in Melbourne, Australia. He was a Java
developer for 10 years before moving on to Ruby and now full-time
JavaScript.
Glen
Maddern: Cyber-intellectual. Creator of Front End
Center. Co-creator of styled-components, CSS Modules. Over uses
emoji.
Mark
Dalgleish: Mark is the CSS Modules co-creator,
@MelbJS organiser, and DesignOps Lead at @seekjobs.
Mandy
Michael: Mandy is the Lead Front End Developer at
Seven West Media in Western Australia. She is a lover of CSS and
Batman and blogs about her adventures in geek fashion.
Patrick
Catanzariti: Patrick is the founder of Dev Diner,
a site that explores developing for emerging tech. He is a
SitePoint contributing editor, an instructor at SitePoint Premium
and O’Reilly, a Meta Pioneer and freelance developer.
Aimee Maree
Forsstrom: Spent the past decade consulting on
Content Management System builds and in research assistance
(Mozilla, Massive Interactive, Southern Cross University,
University of Adelaide).
Charlotte
Jackson: Charlotte is a front-end developer now
at Atlassian, and previously at ClearLeft. She’s worked on large
and small projects for clients including Bike Register, John Lewis
and Bravissimo.
Marcos
Caceres: Marcos works with Mozilla’s DOM
team hacking on Firefox, writes PWA-related W3C
specifications, and co-chairs the W3C’s Web Incubator
Community Group – all from Melbourne, Australia.
That, if we do say so ourselves, is a stunning line-up of
speakers: international and local practitioners who are setting the
standards for front end engineering now and into the future.
This is truly a world class conference, here, in Australia.
We’ll be telling you more about the topics being addressed in
coming weeks, but rest assured we will be tackling the big and
important questions about frameworks, raw code, CSS in JS,
performance, PWA, security, accessibility, modules, fonts,
components, types and a whole lot more.
And it won’t be all lecture style presentations, either. Expect
a few surprises. Really, if you work with front end code, or
work with people who do, Code is the
conference you do not want to miss. Registration is
now open.
Resolved: Blocks are turned into inline-blocks. (In
reference to issue #1341:
Does inlinification really need recursion?)
Resolved: We are provisionally going with option b
(inline-block -> block; inline flow-root -> flow-root). (In
reference to issue #1246:
Blockification doesn’t seem backwards-compatible for
inline-blocks)
TabAtkins will open a new issue to decide if you maintain
separate computed values for just this one case or the whole
possible space of values. Depending on that discussion the previous
resolution may need to be revisited.
Resolved: Define this (propagation of text-decoration
with display:contents) as a box-tree concept.
Resolved: Let’s try it out, go forward with the
diff. (In reference to issue #1118:
Should anonymous boxes always inherit through the box tree?)
If you have a post you want to add to this feed, post a link (or
the whole thing) on the CSS3
Soapbox. If you own a blog with frequent posts about the future
of CSS, and want to be added to this aggregator, please get in
touch with fantasai.
We’re going back to Respond 16 for our Video
of the Week this week, when Sara Soueidan came to visit and
delivered an inspiring, eye-opening keynote presentation on what
can be done with CSS and SVG working together.
