This is the Google Tech Talk that I gave August 17th, 2007 on building a JavaScript library. I derived much of the talk from my experiences in building the jQuery and FUEL JavaScript libraries.
Performance optimization is a crucial aspect of building ‘snappy’ client-side applications and something which all developers using jQuery should bear in mind. In this talk, we're going to take a look at some of the best practices, tips and tricks for improving the performance of your jQuery code in 2011 with some quick wins and a few new surprises along the way.
This is the Google Tech Talk that I gave August 17th, 2007 on building a JavaScript library. I derived much of the talk from my experiences in building the jQuery and FUEL JavaScript libraries.
Performance optimization is a crucial aspect of building ‘snappy’ client-side applications and something which all developers using jQuery should bear in mind. In this talk, we're going to take a look at some of the best practices, tips and tricks for improving the performance of your jQuery code in 2011 with some quick wins and a few new surprises along the way.
Realize mais com HTML 5 e CSS 3 - 16 EDTED - RJLeonardo Balter
Slides apresentados no 16 EDTED, edição Rio de Janeiro, em 21 de Maio de 2011.
Aqui não tem vídeos, animações e códigos apresentados, mas tem os links. Logo passo o link completo.
High Performance JavaScript - WebDirections USA 2010Nicholas Zakas
Ever wonder why the page appears frozen or why you get a dialog saying, “this script is taking too long”? Inside of the browser, JavaScript and the page’s UI are very intertwined, which means they can affect each other and, in turn, affect overall page performance. Ensuring the fastest execution time of JavaScript code isn’t about geek cred, it’s about ensuring that the user experience is as fast and responsive as possible. In a world where an extra second can cost you a visitor, sluggishness due to poor JavaScript code is a big problem. In this talk, you’ll learn what’s going on inside the browser that can slow JavaScript down and how that can end up creating a “slow page”. You’ll also learn how to overcome the conspiracy against your code by eliminating performance bottlenecks.
Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)Nicholas Zakas
In the beginning, progressive enhancement was simple: HTML layered with CSS layered with JavaScript. That worked fine when there were two browsers, but in today's world of multiple devices and multiple browsers, it's time for a progressive enhancement reboot. At the core is the understanding that the web is not print - the same rules don't apply. As developers and consumers we've been fooled into thinking about print paradigms for too long. In this talk, you'll learn just how different the web is and how the evolution of progressive enhancement can lead to better user experiences as well as happier developers and users.
Uma breve descrição sobre o HTML 5 e suas principais características como: forms, a nova estrutura, aúdio e vídeo, etc.
An overview about HTML 5 and its main features such as: forms, new structure, audio and video, etc.
Introductory overview of testing techniques for web application development. Explains where different testing methods fit in to the software development cycle.
Making the HTML5 Video element interactiveCharles Hudson
From Streaming Media West Conference
Huntington Beach, CA
November 2013
C202: HOW TO: Making the HTML5 Video Element Interactive
The HTML5 Video element has now become widely used by browsers and supported in a broad set of websites for streaming video content. With some JavaScript and CSS, we can leverage the HTML video element to create highly interactive experiences for the viewer in both traditional and mobile browsing environments. This hands-on session explores the integration of events with the video timeline, creating positioned hotspots with links and dynamic content, and capturing user input. In addition, the session examines supporting mobile platform browsers along with future opportunities with the HTML5 video tag. Get sample code, ideas, and best practices for making the HTML5 video element an engaging interactive experience for your viewers.
Speaker: Chuck Hudson, Co-Author, HTML5 Developer's Cookbook
An intro to nightwatch(a tool to create and run functional tests, e2e tests using selenium in the background) and examples of cases, also how to integrate nightwatch to a Continous Integration tool
80% of the time it takes for a web page to load is on the client side.
Using all the tips in this presentation should cut 25% to 50% off the load time of optimized page requests.
Drupal (6 or 7) can be used to, fairly easily, implement a whole bunch of these “front-end performance” upgrades, and knock a ton of errors off of the Yahoo! and Google speed-checker tools validation checklists.Get firebug first.
Realize mais com HTML 5 e CSS 3 - 16 EDTED - RJLeonardo Balter
Slides apresentados no 16 EDTED, edição Rio de Janeiro, em 21 de Maio de 2011.
Aqui não tem vídeos, animações e códigos apresentados, mas tem os links. Logo passo o link completo.
High Performance JavaScript - WebDirections USA 2010Nicholas Zakas
Ever wonder why the page appears frozen or why you get a dialog saying, “this script is taking too long”? Inside of the browser, JavaScript and the page’s UI are very intertwined, which means they can affect each other and, in turn, affect overall page performance. Ensuring the fastest execution time of JavaScript code isn’t about geek cred, it’s about ensuring that the user experience is as fast and responsive as possible. In a world where an extra second can cost you a visitor, sluggishness due to poor JavaScript code is a big problem. In this talk, you’ll learn what’s going on inside the browser that can slow JavaScript down and how that can end up creating a “slow page”. You’ll also learn how to overcome the conspiracy against your code by eliminating performance bottlenecks.
Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)Nicholas Zakas
In the beginning, progressive enhancement was simple: HTML layered with CSS layered with JavaScript. That worked fine when there were two browsers, but in today's world of multiple devices and multiple browsers, it's time for a progressive enhancement reboot. At the core is the understanding that the web is not print - the same rules don't apply. As developers and consumers we've been fooled into thinking about print paradigms for too long. In this talk, you'll learn just how different the web is and how the evolution of progressive enhancement can lead to better user experiences as well as happier developers and users.
Uma breve descrição sobre o HTML 5 e suas principais características como: forms, a nova estrutura, aúdio e vídeo, etc.
An overview about HTML 5 and its main features such as: forms, new structure, audio and video, etc.
Introductory overview of testing techniques for web application development. Explains where different testing methods fit in to the software development cycle.
Making the HTML5 Video element interactiveCharles Hudson
From Streaming Media West Conference
Huntington Beach, CA
November 2013
C202: HOW TO: Making the HTML5 Video Element Interactive
The HTML5 Video element has now become widely used by browsers and supported in a broad set of websites for streaming video content. With some JavaScript and CSS, we can leverage the HTML video element to create highly interactive experiences for the viewer in both traditional and mobile browsing environments. This hands-on session explores the integration of events with the video timeline, creating positioned hotspots with links and dynamic content, and capturing user input. In addition, the session examines supporting mobile platform browsers along with future opportunities with the HTML5 video tag. Get sample code, ideas, and best practices for making the HTML5 video element an engaging interactive experience for your viewers.
Speaker: Chuck Hudson, Co-Author, HTML5 Developer's Cookbook
An intro to nightwatch(a tool to create and run functional tests, e2e tests using selenium in the background) and examples of cases, also how to integrate nightwatch to a Continous Integration tool
80% of the time it takes for a web page to load is on the client side.
Using all the tips in this presentation should cut 25% to 50% off the load time of optimized page requests.
Drupal (6 or 7) can be used to, fairly easily, implement a whole bunch of these “front-end performance” upgrades, and knock a ton of errors off of the Yahoo! and Google speed-checker tools validation checklists.Get firebug first.
Douglas Crockford - Programming Style and Your BrainWeb Directions
Computer programs are the most complicated things that humans make. They must be perfect, which is hard for us because humans are not perfect. Programming is thought to be a “head” activity, but there is a lot of “gut” involved. Indeed, it may be the gut that gives us the insight necessary for solving hard problems. But gut messes us up when it come to matters of style. The systems in our brains that make us vulnerable to advertising and propaganda also influence our programming styles. This talk looks systematically at the development of a programming style that specifically improves the reliability of programs. The examples are given in JavaScript, a language with an uncommonly large number of bad parts, but the principles are applicable to all programming languages.
<p>Security design is an important, but often neglected, component of system design. In this session, Douglas Crockford, creator of Javascript Object Notation, will outline the security issues that must be considered in the architecture of Ajax applications.</p>
<p>The design of the browser did not anticipate the needs of multiparty applications. The browser’s security model frustrates useful activities and allows some very dangerous activities. This talk will look at the small set of options before us that will determine the future of the Web.<br />
During this session, attendees will:</p>
<ul>
<li>Learn why effective security is an inherent feature of good design;</li>
<li>Experience a real-time demo of a Ajax client/server system based on sound security principles</li>
<li>See how to apply secure design to rich web applications.</li>
</ul>
Presentation about the features of JavaFX. See how to use video, different deployment types, JavaScript integration, annimations and more. Demo's not included.
The presentation that I gave at Future of Web Apps, London, October 3, 2007. More information here:
http://ejohn.org/blog/future-of-firefox-and-javascript/
Jun Heider - Flex Application Profiling By Example360|Conferences
This session will be light on slides and heavy on demonstration. The session will start with a brief explanation of the concepts that will be discussed and then kick into high gear with demonstrations and live profiling with the Flex Builder Profiler. During the session the features of the Flex Builder Profiler will be illustrated and light will be shed on how to analyze the data collected by the Profiler. The goal of this session will be to arm the attendee with the ability to use the Flex Builder Profiler to help increase the responsiveness and decrease the memory consumed by their applications.
Le nuove frontiere dell'AI nell'RPA con UiPath Autopilot™UiPathCommunity
In questo evento online gratuito, organizzato dalla Community Italiana di UiPath, potrai esplorare le nuove funzionalità di Autopilot, il tool che integra l'Intelligenza Artificiale nei processi di sviluppo e utilizzo delle Automazioni.
📕 Vedremo insieme alcuni esempi dell'utilizzo di Autopilot in diversi tool della Suite UiPath:
Autopilot per Studio Web
Autopilot per Studio
Autopilot per Apps
Clipboard AI
GenAI applicata alla Document Understanding
👨🏫👨💻 Speakers:
Stefano Negro, UiPath MVPx3, RPA Tech Lead @ BSP Consultant
Flavio Martinelli, UiPath MVP 2023, Technical Account Manager @UiPath
Andrei Tasca, RPA Solutions Team Lead @NTT Data
Epistemic Interaction - tuning interfaces to provide information for AI supportAlan Dix
Paper presented at SYNERGY workshop at AVI 2024, Genoa, Italy. 3rd June 2024
https://alandix.com/academic/papers/synergy2024-epistemic/
As machine learning integrates deeper into human-computer interactions, the concept of epistemic interaction emerges, aiming to refine these interactions to enhance system adaptability. This approach encourages minor, intentional adjustments in user behaviour to enrich the data available for system learning. This paper introduces epistemic interaction within the context of human-system communication, illustrating how deliberate interaction design can improve system understanding and adaptation. Through concrete examples, we demonstrate the potential of epistemic interaction to significantly advance human-computer interaction by leveraging intuitive human communication strategies to inform system design and functionality, offering a novel pathway for enriching user-system engagements.
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Ramesh Iyer
In today's fast-changing business world, Companies that adapt and embrace new ideas often need help to keep up with the competition. However, fostering a culture of innovation takes much work. It takes vision, leadership and willingness to take risks in the right proportion. Sachin Dev Duggal, co-founder of Builder.ai, has perfected the art of this balance, creating a company culture where creativity and growth are nurtured at each stage.
Key Trends Shaping the Future of Infrastructure.pdfCheryl Hung
Keynote at DIGIT West Expo, Glasgow on 29 May 2024.
Cheryl Hung, ochery.com
Sr Director, Infrastructure Ecosystem, Arm.
The key trends across hardware, cloud and open-source; exploring how these areas are likely to mature and develop over the short and long-term, and then considering how organisations can position themselves to adapt and thrive.
State of ICS and IoT Cyber Threat Landscape Report 2024 previewPrayukth K V
The IoT and OT threat landscape report has been prepared by the Threat Research Team at Sectrio using data from Sectrio, cyber threat intelligence farming facilities spread across over 85 cities around the world. In addition, Sectrio also runs AI-based advanced threat and payload engagement facilities that serve as sinks to attract and engage sophisticated threat actors, and newer malware including new variants and latent threats that are at an earlier stage of development.
The latest edition of the OT/ICS and IoT security Threat Landscape Report 2024 also covers:
State of global ICS asset and network exposure
Sectoral targets and attacks as well as the cost of ransom
Global APT activity, AI usage, actor and tactic profiles, and implications
Rise in volumes of AI-powered cyberattacks
Major cyber events in 2024
Malware and malicious payload trends
Cyberattack types and targets
Vulnerability exploit attempts on CVEs
Attacks on counties – USA
Expansion of bot farms – how, where, and why
In-depth analysis of the cyber threat landscape across North America, South America, Europe, APAC, and the Middle East
Why are attacks on smart factories rising?
Cyber risk predictions
Axis of attacks – Europe
Systemic attacks in the Middle East
Download the full report from here:
https://sectrio.com/resources/ot-threat-landscape-reports/sectrio-releases-ot-ics-and-iot-security-threat-landscape-report-2024/
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdfPeter Spielvogel
Building better applications for business users with SAP Fiori.
• What is SAP Fiori and why it matters to you
• How a better user experience drives measurable business benefits
• How to get started with SAP Fiori today
• How SAP Fiori elements accelerates application development
• How SAP Build Code includes SAP Fiori tools and other generative artificial intelligence capabilities
• How SAP Fiori paves the way for using AI in SAP apps
DevOps and Testing slides at DASA ConnectKari Kakkonen
My and Rik Marselis slides at 30.5.2024 DASA Connect conference. We discuss about what is testing, then what is agile testing and finally what is Testing in DevOps. Finally we had lovely workshop with the participants trying to find out different ways to think about quality and testing in different parts of the DevOps infinity loop.
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...DanBrown980551
Do you want to learn how to model and simulate an electrical network from scratch in under an hour?
Then welcome to this PowSyBl workshop, hosted by Rte, the French Transmission System Operator (TSO)!
During the webinar, you will discover the PowSyBl ecosystem as well as handle and study an electrical network through an interactive Python notebook.
PowSyBl is an open source project hosted by LF Energy, which offers a comprehensive set of features for electrical grid modelling and simulation. Among other advanced features, PowSyBl provides:
- A fully editable and extendable library for grid component modelling;
- Visualization tools to display your network;
- Grid simulation tools, such as power flows, security analyses (with or without remedial actions) and sensitivity analyses;
The framework is mostly written in Java, with a Python binding so that Python developers can access PowSyBl functionalities as well.
What you will learn during the webinar:
- For beginners: discover PowSyBl's functionalities through a quick general presentation and the notebook, without needing any expert coding skills;
- For advanced developers: master the skills to efficiently apply PowSyBl functionalities to your real-world scenarios.
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdfPaige Cruz
Monitoring and observability aren’t traditionally found in software curriculums and many of us cobble this knowledge together from whatever vendor or ecosystem we were first introduced to and whatever is a part of your current company’s observability stack.
While the dev and ops silo continues to crumble….many organizations still relegate monitoring & observability as the purview of ops, infra and SRE teams. This is a mistake - achieving a highly observable system requires collaboration up and down the stack.
I, a former op, would like to extend an invitation to all application developers to join the observability party will share these foundational concepts to build on:
3. Analyzing Performance
Optimizing performance is a huge
✦
concern: Faster code = happy users!
Measure execution time
✦
Loop the code a few times
✦
Measure the difference:
✦
✦ (new Date).getTime();
4. Stack Profiling
jQuery Stack Profiler
✦
Look for problematic methods and plugins
✦
http://ejohn.org/blog/deep-profiling-
✦
jquery-apps/
5.
6. Accuracy of
JavaScript Time
We’re measuring the performance of
JavaScript from within JavaScript!
http://ejohn.org/blog/accuracy-of-javascript-time/
11. Performance Tools
How can we get good numbers?
✦
We have to go straight to the source: Use
✦
the tools the browsers provide.
Tools:
✦
✦ Firebug Profiler
✦ Safari Profiler
✦ (Part of Safari 4)
✦ IE 8 Profiler
28. Strategy Games
Very server-side heavy
✦
✦ Most logic hidden from the user
Hard to cheat
✦
✦ Casual cheaters can’t change values
✦ Dedicated cheaters have to write full AI
29. Intelligence Games
Player’s intelligence/knowledge challenged
✦
Games could be quick or slow-paced
✦
Easy to cheat
✦
✦ Casual cheaters can open dictionary /
encyclopedia for answers
33. Speed/Accuracy Games
Require low latency
✦
Fast-paced and addictive
✦
JavaScript completely fails
✦
✦ Garbage Collection cycles freeze the
browser
None, or few, Accuracy-centric JavaScript
✦
games
Experienced coders can easily cheat
✦
✦ (A bot to hit the keys at the right time)
35. Guitar Hero
Heavily dependent upon accuracy
✦
✦ (Hit the right notes at the right time)
Garbage collection cycles absolutely kill
✦
the game
Rendering the play area is also difficult
✦
✦ And impossible in all browsers.
✦ (Use HTML 5 Canvas Element)
36. Failures on All Ends
Strategy: Slow, secret server-side code
✦
Intelligence: Easily cheatable
✦
Accuracy: Too hard to implement
✦
Optimal solution would be a combination
✦
of the above.
JavaScript games can’t be like other games,
✦
have to be unique.
37. What can make a fun game?
Quick play
✦
Points
✦
High Scores
✦
Head-to-head competition
✦
38. Wordsplay
Real-time Boggle
✦
Head-to-head with other players
✦
http://www.wordsplay.net/
39. Tringo
Tetris + Bingo (based on a Second Life
✦
game)
http://ejohn.org/tringo/
41. vs. Cheating
All words are recorded with exact time
✦
information
Game is “played back” on the server to
✦
verify score integrity using Server-Side JS
This data can be used to simulate a multi-
✦
player experience!
42. DeepLeap
Works in multiple languages
✦
✦ Dictionaries pulled from OpenOffice,
can build a Spanish version in < 5sec
Players can challenge each other head-to-
✦
head
Score multiplier (carry over from Guitar
✦
Hero)
47. Browser Support Grid
IE Firefox Safari Opera Chrome
Previous 6.0 2.0 3.0 9.5
Current 7.0 3.0 3.2 9.6 1.0
Next 8.0 3.1 4.0 10.0 2.0
jQuery Browser Support
48. Browser Support Grid
IE Firefox Safari Opera Chrome
Previous 3.0 9.5
6.0 2.0
Current 7.0 3.0 3.2 9.6 1.0
Next 8.0 3.1 4.0 2.0
10.0
jQuery 1.3 Browser Support
49. The Scaling Problem
The Problem:
✦
✦ jQuery has 6 test suites
✦ Run in 11 browsers
✦ (Not even including multiple platforms!)
All need to be run for every commit,
✦
patch, and plugin.
JavaScript testing doesn’t scale well.
✦
50. Distributed Testing
Hub server
✦
Clients connect and help run tests
✦
A simple JavaScript client that can be run
✦
in all browsers
✦ Including mobile browsers!
✦ TestSwarm
51. FF 3.5 FF 3.5 FF 3.5
IE 6
IE 6
FF 3 IE 6
Op 9
FF 3
IE 7
TestSwarm
IE 7
Test Suite Test Suite Test Suite
52. Manual Testing
Push tests to users who follow pre-defined
✦
steps
Answer ‘Yes’/’No’ questions which are
✦
pushed back to the server.
An effective way to distribute manual test
✦
load to dozens of clients.
53. TestSwarm.com
Incentives for top testers (t-shirts, books)
✦
Will be opening for alpha testing very soon
✦
Help your favorite JavaScript library
✦
become better tested!
http://testswarm.com
✦