JSJ 334: “Web Performance API” with Dan Shappir
JavaScript Jabber9 Loka 2018

JSJ 334: “Web Performance API” with Dan Shappir

Panel: Special Guests: Dan Shappir (Tel Aviv)In this episode, the panel talks with Dan Shappir who is a computer software developer and performance specialist at Wix.com. As Dan states, his job is to make 100 million websites (hosted on the Wix platform) load and execute faster! Past employment includes working for companies, such as: Ericom, Ericom Software, and BackWeb. He studied at Technion Institute of Management and currently lives in Tel Aviv, Israel. The panel talks about web performance API among other things. Check it out!Show Topics:1:29 – Charles: Let us know who you are and why you’re famous!1:39 – “Hello!” from Dan Shappir.2:25 – Charles: You should say that you go to EACH site EVERY day out of the millions of sites out there.2:53 – Charles: My mom mentioned Wix to me at first. My mom teaches High School Math.3:16 – Dan: Yes that is our mission statement. That everyone can get a website without the knowledge of how to build a website.3:52 – Aimee makes her comments.3:59 – Dan: On our platform we try to offer people flexibility. There are bounds and limits, but people can do their very own thing, though. To make Wix faster because as we add more features and functionality that is our goal.4:40 – Chuck: Okay, I know how to make X perform a little bit better. You are looking at a platform that controls TONS of sites, how do you even go about that?4:58 – Dan: It is more difficult then that. We have millions of users leveraging the platform but there are a lot of developers in Wix who are developing the platform. I don’t think anyone at Wix has a total grasp of the complexity of the platform that we built. We have hundreds of frontend people working on our platform. All of them have pieces to the kingdom. We have processes in place with code reviews and whatnot, but there is so much going on. There is a change every 2 minutes, 24/7. We need to make sure progressing instead of regressing. 6:54 – Aimee: I think it was interesting in one of the links you sent over. Because you know when something is getting worse you consider that a bug.7:15 – Dan: It is more than a bug because if we see regression in performance then that is a problem. I can literally see any part of the organization and say, “stop” if it will7:57 – Chuck: We are talking about performance, but what does that mean? What measures are there?8:15: Dan: We are looking at performance can mean different things in different contents. User sites, for example, most important aspect is load time. How quickly the page loads and gets open to the viewer to that specific site. When they click something they want it instantly and no drag time. It does change in different contexts.9:58 – Chuck: People do talk about load time. People have different definitions of it.10:12: Dan: Excellent question. When you look at the different sites through Wix. Different people who build sites – load time can mean something else to everybody. It can mean when you see the MAIN text or the MAIN image. If it’s on an ECON site then how soon can they purchase or on a booking site, how long can the person book X product.I heard someone at a conference say that load time is when: HERO TEXT And HERO IMAGE are displayed.12:14 – Chuck: What is faster React or Vue?12:21 – NEW HOST: Not sure. It all depends.12:34 – Dan: We are big into React. We are one of the big React users outside of Facebook. I joined Wix four years ago, and even back then we were rebuilding our framework using React. One of our main modifications is because we wanted to do server-side rendered.13:27 – Christopher asks Dan a question.14:16 – Dan: We are in transition in this regard. Before we were totally client-site rendered, and that was the case until middle of last year. Then we deployed...Dan: We are 100% server-side rendered now. Some things we are still using JavaScript. We have another project going on now and it’s fully CSS, and little JavaScript as possible. What you might want to do with that site is...You might get in a few months every Wix site will be visible even if JavaScript is disabled.16:26 – Aimee adds in her comments and observations to this topic.16:55 – Dan: We don’t want things displayed incorrectly before it lays out. We hide the content while it’s downloading then make it visible. They lay-outing are done faster, because...17:44 – Christopher asks Dan a question.18:04 – Dan: I got into API...Either you are moving forward or are you moving back. AKA – You are either progressing or regressing.Different stages:1.) Development stage2.) Pre-Production (automated tools that check the performance with specific use cases)3.) Check it out!It’s beneficial to use these APIs.21:11 – Christopher: What is performance APIs?21:38 – Dan: There is a working group – Todd from Microsoft and others who are exposing the information (that is available in the browser) out into the browser. When the browser downloads a certain source (image, font, etc.) it can measure the various stages of downloading that feature. You have these different sages of downloading this resource. The browser can measure each of these stages and then expose them to you. Basically it’s for the browser to expose this information to you and in a way that is coherent and uniform. It essentially maintains this buffer that puts performance entries sequentially.Dan continues explaining this topic in detail.25:55 – Dan: You have this internal buffer...28:45 – Advertisement – Sentry – They support opensource.29:39 – Christopher: everything you are saying seems that I can use this or that tab right now...Why would I prefer the API to something visual, hypothetically?30:03 – Dan: Three Different Stages. (See above.)This information is very, very helpful during the developmental stage. Say you got a link from someone...Dan mentions: Performance.mark 34:04 – Aimee: When you were talking about resource-ends. Many people don’t know what this is. Can you spend 2-3 minutes about how you guys are using these? Are there people can add for big bang for their buck?34:41 – Dan: This might want to be a topic for its own podcast show.Dan gives a definition of what a resource-end means.Go back to fonts as an example.Pre-connect for example, too.39:03 – Dan: Like I said, it’s a huge topic.You have to exercise some care. Bandwidth is limited. Make sure you aren’t blocking other resources that you do need right now.40:02 – Aimee: Sounds like a lot of great things to tap into. Another question I have is about bundling.40:27 – Dan: One of the things that we try to do (given that we are depending on the JavaScript we are downloading) we need to download JavaScript content to the client side. It has been shown often that JS is the most impactful resources that you need to download. You really want to be as smart as possible with that. What is even more challenging is the network protocols are changing.Dan continues to go in-depth about this topic. Dan: What we have found is that you want to strive to bundle resources together.44:10 – Aimee: Makes sense.44:15 – Dan continues talking about this topic.45:23 – Chuck asks two questions. (First question is now and second question is at 51:32.)2 Questions:1. You gather information from web performance AI - What system is that?45:42 – Dan: I am not the expert in that. I will try not to give misleading information. Actually let me phrase it different. There are 3rd party tools that you can use leverage in your website. IF you are building for commercial reasons I highly recommend that you use performance-monitoring solution. I am not going to advertise one because there are tons out there. We ended up rolling out our own infrastructure because our use case is different than most.At a conference I talked with a vendor and we talked about...51:32 – 2nd Question from Charles to Dan: Now you’ve gathered this information now what to you do? What patterns? What do you look for? And how do you decide to optimize things?54:23 – Chuck: Back to that question, Dan. How should they react to it and what are they looking for54:41 – Dan: Three main ways: 1.) Generate alerts 2.) See trends over long period of time 3.) Looking at real-time graphs.Frontend developer pro is that likely being woken up in the middle of the night is lower. We might be looking at the real time graph after we deployed...57:31 – Advertisement – Get a Coder Job!58:10 – Picks!Links:

Become a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

Jaksot(735)

159 JSJ Why JavaScript Is Hard

159 JSJ Why JavaScript Is Hard

02:54 - Everyone Gets It But MeMartin Fowler04:06 - Tools You “Need” to Know06:29 - Clojures07:39 - JavaScript as “Object-Oriented” vs “Event-Oriented”Object-Oriented Programming09:30 - Code That Can’t Be Serialized or Deserialized10:49 - Clojures (Cont’d)14:32 - The DOM (Document Object Model)[YouTube] Angular + React = Speed by Dave Smith @ ng-conf 201519:52 - Math Is HardIEEE754 (Floating-Point Arithmetic)22:39 - PrototypesSebastian Porto: A Plain English Guide to JavaScript Prototypes 25:43 - Asynchronous ProgrammingDebuggingGregor Hohpe: Your Coffee Shop Doesn’t Use Two-Phase Commit How Do You Learn It?32:23 - Browser Environments34:48 - Keeping Up with JavaScript35:46 - NodeNestingContext Switching42:48 - UTF-8 Conversion44:56 - Jamison’s StackReactKoa    RethinkDBio.jsWebpackCheck out and sign up to get new on React Rally: A community React conference on August 24th and 25th in Salt Lake City, Utah!Picks Jason Orendorff: ES6 In Depth (Aimee) Cat Strollers (Aimee) Stephano Legacy of the Void (Joe) A Gentleman's Guide to Love and Murder (Joe) Gregor Hohpe: Your Coffee Shop Doesn’t Use Two-Phase Commit  (AJ) Firefox OS (AJ) Flame (AJ) OpenWest 2015 (AJ) 801 Labs Hackerspace (AJ) Stack Overflow Careers (AJ) Dota 2 (Jamison) Beats, Rye & Types Podcast (Jamison) JS Remote Conf Talks (Chuck) Workflowy (Chuck) Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

13 Touko 201558min

158 JSJ Roots with Jeff Escalante

158 JSJ Roots with Jeff Escalante

02:30 - Jeff Escalante IntroductionTwitter GitHubCarrot Creative03:15 - Roots[GitHub] roots05:20 - Static Sites vs Dynamic SitesResource: Static vs Dynamic WebsitesScaleSEO (Search Engine Optimization)13:47 - Plugins 15:48 - Multipass Compile FunctionalityJSX20:27 - Roots vs Other Static Site GeneratorsTechnical Debt22:31 - Netlify 26:22 - HTTPSMathias Biilmann: Five Reasons you want HTTPS for your Static siteLet's EncryptExtended Validation Certificate (EV Certificate)Picks ECMAScript 6 — New Features: Overview & Comparison (Aimee) Jacob Kaplan-Moss: Keynote at Pycon 2015 (Aimee) Dr. Who (AJ) Power Rangers (AJ) Marvel Digital Comics Unlimited (Joe) GoFundMe (Joe) Netlify (Jeff) accord (Jeff) Contentful (Jeff) Special Guest: Jeff Escalante. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

6 Touko 201539min

157 Moving Your Rendering Engine to React with Amit Kaufman and Avi Marcus

157 Moving Your Rendering Engine to React with Amit Kaufman and Avi Marcus

02:43 - Amit Kaufman IntroductionGitHubWix03:07 - Avi Marcus IntroductionGitHubWix04:35 - Why Move Your Rendering Engine to React?[GitHub] react 07:25 - Using JavaScriptObject-Oriented Programming09:57 - Business Process and Progression (Getting Managerial Approval)Client-Side vs. Server-Side Rendering12:46 - Manipulation15:11 - Layout and PerformanceMeasuring and Patching20:21 - Building Client-Side Applications in GeneralAbstractionMake Code Predictable and ClearHave a Goal26:00 - Events 29:30 - StorageLazy Components31:31 - Immutability 34:36 - Flux and Keeping Code MaintainablePackages38:19 - Two-way Data BindingPicks Notes on the book "Art & Fear" by David Bayles & Ted Orland (Jamison) Papers (Jamison) Dynamo: Amazon’s Highly Available Key-value Store (Jamison) LDS Conference Talks (AJ) Stephen Young: Why your code is so hard to understand (Aimee) Kombucha (Aimee) Pascal Precht: Integrating Web Components with AngularJS (Pascal) Template Syntax Constraints and Reasoning (Design Doc) (Pascal) RUNNING WITH RIFLES (Joe) [Pluralsight Webinar] AngularJS 2.0: What you need to know with Joe (Joe) Whiplash (Amit) Dan Ariely: What makes us feel good about our work? (Amit) React Templates (Amit) Esprima (Avi) Big Hero 6 (Avi) Check out and sign up to get new on React Rally: A community React conference on August 24th and 25th in Salt Lake City, Utah!Special Guests: Amit Kaufman and Avi Marcus. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

29 Huhti 201552min

156 JSJ Soft Skills and Marketing Yourself as a Software Developer with John Sonmez

156 JSJ Soft Skills and Marketing Yourself as a Software Developer with John Sonmez

Check out ReactRally: A community React conference in Salt Lake City, UT from August 24th-25th!03:36 - John Sonmez IntroductionTwitter GitHub Simple ProgrammerThe Entreprogrammers PodcastSoft Skills: The Software Developer's Life Manual by John SonmezHow to Market Yourself as a Software Developer Course04:29 - Mastermind GroupsThink and Grow Rich: The Landmark Bestseller - Now Revised and Updated for the 21st Century by Napoleon Hill05:53 - “Soft Skills”Why Care About Soft Skills?People Skills FinancesFitness11:53 - Learned vs InnateLifting Limited BeliefsPractice14:14 - Promotion (Managerial) Paths The Peter Principle17:52 - “Marketing” Value: Give Away 90% / Charge For 10%Seeming “Spammy” (Resistance to Sell)Neil Patel's BlogDocumentation for YourselfAJ O'Neal: How to Tweet from NodeJS 29:53 - Get Up and CODE!#086: Figure Skating and Software Development with Aimee Knight#067: Weight Loss Plan for Charles (Max Wood)33:47 - Burnout Do the Work by Steven PressfieldThe War of Art: Break Through the Blocks and Win Your Inner Creative Battles by Steven PressfieldSystems and Habits (Routines)Methods of ExecutionGet John’s How to Market Yourself as a Software Developer Course for $100 off using the code JSJABBER Comment on this episode for your chance to win one of two autographed copies of Soft Skills: The Software Developer's Life Manual by John Sonmez Picks The Recurse Center (Jamison) Code Words Blog (Jamison) DayZ Player Sings (And Plays Guitar) For His Life (Jamison) Demon (Jamison) Mastodon: Leviathan (Jamison) Jan Van Haasteren Puzzles (Joe) Hobbit Tales from the Green Dragon Inn (Joe) AngularJS-Resources (Aimee) Superfeet Insoles (Aimee) Good Mythical Morning (AJ) The Magic of Thinking Big by David J. Schwartz (Chuck) Streak (John) The E-Myth Revisited: Why Most Small Businesses Don't Work and What to Do About It by Michael E. Gerber (John) Influence: The Psychology of Persuasion, Revised Edition by Robert B. Cialdini (John) Do the Work by Steven Pressfield (John) The War of Art: Break Through the Blocks and Win Your Inner Creative Battles by Steven Pressfield (John) Special Guest: John Sonmez. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

22 Huhti 20151h

155 JSJ Webtorrent with Feross Aboukhadijeh

155 JSJ Webtorrent with Feross Aboukhadijeh

Support our Teespring campaign! Get your JavaScript Jabber unisex t-shirts, hoodies, ladies’-sized, and long-sleeve tees!02:01 - Feross Aboukhadijeh IntroductionTwitter GitHub Blog02:39 - Peer-to-Peer Background, Content Delivery Networks (CDNs)WebRTCPeerCDNBitTorrent09:43 - The BitTorrent Protocol and Hypertext Transfer Protocol (HTTP)[YouTube] Feross Aboukhadijeh: WebTorrent (JSConf.Asia 2014) Distributed Hash Table (DHT)13:08 - WebTorrent = BitTorrent over WebRTCTransmission Control Protocol (TCP)The User Datagram Protocol (UDP)Session Traversal Utilities for NAT (STUN)17:22 - Where Do Original Files Come From?Tracker ServersBitTorrent Enhancement Proposal (BEP)21:23 - Opposition27:26 - Where is WebTorrent Going? (Use Cases)Instant.io[GitHub] instant.io29:52 - Live Broadcasts31:12 - Progression of BitTorrent Over TimeTechnical Decentralization35:03 - Same-Origin Policy 36:33 - Firefox Hello PicksJanuary 12th, 2016: Goodbye IE8 and IE9! (Dave) js-must-watch (Aimee) Headspace (Aimee) Popcorn Time (AJ) Steelheart (The Reckoners) by Brandon Sanderson (Chuck) Teespring (Chuck) Loop Drop by Matt McKegg (Feross) SceneVR by Ben Nolan (Feross) WebTorrent (Feross) node-nat-upnp (AJ) node-nat-pmp (AJ) simple-peer (Feross)Special Guest: Feross Aboukhadijeh. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

16 Huhti 201547min

154 JSJ Raygun.io Error Reporting and Workflow with John-Daniel Trask

154 JSJ Raygun.io Error Reporting and Workflow with John-Daniel Trask

02:35 - John-Daniel Trask Introduction and BackgroundTwitter GitHub BlogMindscape@MindscapeHQ04:57 - Raygun.io@raygunio06:23 - Crash Reporting The Right WayError GroupingSuppress Notifications10:06 - Most Common Errors12:05 - Source Maps 19:16 - Managing Error Reporting in Gross Environments22:17 - Determining Where The Issue Is24:45 - Do People Write Their Own Errors?26:23 - Frameworks Support28:28 - Collecting Data: Privacy and Security30:01 - Does working in error reporting make you judgemental of others’ code?“DDOSing Yourself”32:42 - Planning for Rare Exceptions33:36 - Tactics to Cut Down on Messages35:53 - Gathering Basic Debugging Information37:58 - Getting the BEST InformationPromisesStockholm Syndrome42:24 - The Backend: Node.jsThe raygun4node provider43:24 - “Creating an Application”Picks LDS Connect (AJ) LDS I/O (AJ) TED Talk About Nothing (Dave) OlliOlli 2 Soundtrack (Jamison) Jurassic Park (Joe)  ng-vegas (Joe) WASD CODE 87-Key Illuminated Mechanical Keyboard with White LED Backlighting - Cherry MX Clear (Chuck) Grifiti Fat Wrist Pad (Chuck) Thank You Rails Clips Kickstarter Backers! (Chuck) Mastery by Robert Greene (Chuck) Ready Player One by Ernest Cline (Chuck) The Pirates of Silicon Valley (John-Daniel) littleBits (John-Daniel)Special Guest: John-Daniel Trask. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

8 Huhti 201558min

153 JSJ Careers for Junior Developers with Aimee Knight

153 JSJ Careers for Junior Developers with Aimee Knight

02:26 - Aimee Knight IntroductionTwitter GitHub BlogMessage Systems02:48 - Figure Skating => ProgrammingPersistenceBalance Between Mind and Body05:03 - Blogging (Aimee’s Blog)06:02 - Becoming Interested in ProgrammingTreehouse@treehouse Code School@codeschool Rails Girls@railsgirls RailsBridge@railsbridge 08:43 - Why Boot Camps?10:04 - MentorsIdentifying a MentorContinuing a Mentorship13:33 - Picking a Boot Camp16:23 - Self-Teaching Prior to Attending Boot Camps20:33 - Finding Employment After the Boot CampBaltimore NodeSchoolPassionInterview Prep26:27 - Being a “Woman in Tech”30:57 - Better Preparing for Getting Started in ProgrammingBe Patient with Yourself32:07 - InterviewsGetting to Know CandidatesCoding Projects and Tests41:05 - Should you get a four-year degree to be a programmer?Eliza BrockPicks Aarti Shahani: What Cockroaches With Backpacks Can Do. Ah-mazing (Jamison) Event Driven: How to Run Memorable Tech Conferences by Leah Silber (Jamison) The Hiring Post (Jamison) Kate Heddleston: Argument Cultures and Unregulated Aggression (Jamison) Axios AJAX Library (Dave) Unbroken: A World War II Story of Survival, Resilience, and Redemption by Laura Hillenbrand (Dave) [YouTube] Good Mythical Morning: Our Official Apocalypse (AJ) Majora's Mask Live Action: The Skull Kid (AJ) The Westin at Lake Las Vegas Resort & Spa (Joe) Alchemists (Joe) Valerie Kittel (Joe) The Earthsea Trilogy: A Wizard of Earthsea; The Tombs of Atuan; The Farthest Shore by Ursula K. Le Guin (Chuck) Traction: Get a Grip on Your Business by Gino Wickman (Chuck) Freelancers’ Answers (Chuck) Drip (Chuck) Brandon Hays: Letter to an aspiring developer (Aimee) SparkPost (Aimee) Exercise and Physical Activity (Aimee)Special Guest: Aimee Knight. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

1 Huhti 20151h 6min

152 JSJ GraphQL and Relay with Nick Schrock and Joe Savona

152 JSJ GraphQL and Relay with Nick Schrock and Joe Savona

02:25 - Nick Shrock IntroductionTwitter02:40 - Joe Savona IntroductionTwitter GitHhubBlog02:49 - Facebook and Open Source04:10 - GraphQL and Relay Overview“React for Your Data” / Component-based Data Fetching 06:11 - Unique to React? Passing Down Through the HierarchyXHPRepresentational State Transfer (REST)10:09 - QueriesToolingGraphicalPulling Definitions14:13 - Why Do I Care? (As Someone Not Working at Facebook)15:21 - Building Applications with GraphQL and Relay 19:01 - GraphQL and Building Backends21:42 - Drivers and Client SoftwareSynthesize => Code GenerationFluxContainer Classes30:58 - Reusing Components31:50 - Data Management34:25 - Open Source 36:40 - Reflecting Backend Constraints? (Optimizing the Backend)43:02 - Relationships => Logs46:24 - Security47:16 - Replacing REST (Adopting New Technology)“The Progressive Disclosure of Complexity”52:14 - What You Wouldn’t Use GraphQL or Relay ForGamesPicks Another Eternity by Purity Ring (Jamison) JT Olds: What riding a unicycle can teach us about microaggressions (Jamison) OCReMix (AJ) Duet Display (Chuck) Summoners War (Chuck) Thinking, Fast and Slow by Daniel Kahneman (Joe) Learning a new language (Joe) Other People: What Kind of Man (Nicolas Jaar remix) - Florence & the Machine (Nick) Boosted Boards (Nick) The Onion: Succession Of Terrible Events Fails To Befall 33-Year-Old Riding Longboard To Digital Media Job (Nick)Special Guests: Joe Savona and Nick Schrock. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

25 Maalis 201539min

Suosittua kategoriassa Liike-elämä ja talous

sijotuskasti
psykopodiaa-podcast
mimmit-sijoittaa
rss-rahapodi
ostan-asuntoja-podcast
rss-lahtijat
taloudellinen-mielenrauha
io-techin-tekniikkapodcast
oppimisen-psykologia
herrasmieshakkerit
rahapuhetta
hyva-paha-johtaminen
pomojen-suusta
rss-rahamania
inderespodi
rss-h-asselmoilanen
rss-startup-ministerio
rss-pinnan-alle
rss-vaikuttavan-opettajan-vierella
rss-sisalto-kuntoon