{"id":34935390,"url":"https://github.com/chrisl8888/jsconf-18-notes","last_synced_at":"2026-03-14T22:37:43.589Z","repository":{"id":146995041,"uuid":"145591941","full_name":"chrisl8888/jsconf-18-notes","owner":"chrisl8888","description":null,"archived":false,"fork":false,"pushed_at":"2018-08-22T01:20:36.000Z","size":49,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-11T05:30:36.218Z","etag":null,"topics":["jsconf"],"latest_commit_sha":null,"homepage":null,"language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chrisl8888.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-08-21T16:40:51.000Z","updated_at":"2018-08-22T01:20:37.000Z","dependencies_parsed_at":"2023-06-01T23:31:03.510Z","dependency_job_id":null,"html_url":"https://github.com/chrisl8888/jsconf-18-notes","commit_stats":null,"previous_names":["chrisl8888/jsconf-18-notes"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/chrisl8888/jsconf-18-notes","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chrisl8888%2Fjsconf-18-notes","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chrisl8888%2Fjsconf-18-notes/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chrisl8888%2Fjsconf-18-notes/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chrisl8888%2Fjsconf-18-notes/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chrisl8888","download_url":"https://codeload.github.com/chrisl8888/jsconf-18-notes/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chrisl8888%2Fjsconf-18-notes/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30520682,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-14T19:51:21.629Z","status":"ssl_error","status_checked_at":"2026-03-14T19:51:12.959Z","response_time":57,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["jsconf"],"created_at":"2025-12-26T18:02:50.556Z","updated_at":"2026-03-14T22:37:43.575Z","avatar_url":"https://github.com/chrisl8888.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"# JSConf '18 Notes\n\n## Track A: Learning through Art: An Introduction to VR with Billy Roh\n\nTake inspiration from art specifically the [obliteration room](https://play.qagoma.qld.gov.au/looknowseeforever/works/obliteration_room/)\n\nPoly [poly.google.com](poly.google.com)\n\na-frame has a asset management system\ncreate id for each item\n\nA-Frame\n- Mozilla framework\n- uses semantic syntax\n- \u003ca-entity\u003e is a generic container\n- can create games\n\nLighting\n- Spotlight\n- Directional (like the sun)\n- Hemisphere (ambient)\n\nCan set decay from sorce, distance, etc\n\nUsing a single light will turn off other lights\n- Be intentional\n- each light incurs performance cost\n- 12 light sources -\u003e 20 fps\n- 3 light sources -\u003e 30fps\n\nCreate stickers to add to scene\n\nPhysics engine\nA frame provides engine to \n- Bodies\n  - Dynamic body can move\n  - static body will be stick\n\nCollision event listeners\n- can turn them into a static body after it is collide with object\n\nEach of the stickers land ackwardly because the physics engine assumes its a box\n- for optimization it's a box\n\nMoving forward\n- can create paintings\n- can download and remix too\n- with vr can be meaingful interactive\n\nDemo\n\nhttp://billyroh.com/obliteration\n\n## Track A: CivicHacking.JS: Helping your Community using JavaScript with Caroline Dikibo\n\nHackathons are great but don't provide usefulness\n- Apps should be opensource cities have same problems\n\nLearned react through mentorship\n\nProblems with Civic hacking\n- Getting access to goverment officials to build apps is difficult\n- Gov't officials are hard to get a hold of\n\nCivicHacking\n- Doesn't pay\n- Seeked grants for options\n- Grant money as option\n- Grant money takes a lot of time\n\nResources\n- Users might only have phones\n- Must consider audience some \n\nHow to start\n- Join a local brigade\n- Convince your workplace\n\n\n# Track A: I See: Overcoming Challenges in Software Development by Kevin o'neil\n\n@__kev__oneill on twitter\n\n- born with nystagmus\n- born with myopia or nearsightness\n- vision condition which makes eyes with uncontrolled movements\n- eye will move to random directions\n- amblyopia \n  - lazy eye\n\ndigital divide with people with disabilities\n- pew research; disabled 3 times more likely not to go online\n\ndifficulty with getting a job\n- took a year\n- couldn't get to work because can't drive in california\n- had to look for places with public transportation\n\npixel perfect\n- chrome extensions can set an image and lay on top of your website\n- compare final website to design\n- zoom tool in macbook to help with compare with pixel perfect extensions\n\nThemes\n- Created a \"City Lights UI\" theme in Atom\n- not created in vscode yet\n\nWork issues with others\n- because of near-sightedness\n- would require others to change their settings\n- there is a better way!\n- vs live share / teletype\n\nResources\n- Udacity has a great course on accessibility\n- created by google\n- couple chapters or couple of hours\n\n\n# Track B: No time for type by Nick Nisi\n\nLearned perl - dynamic language\n- run it without much setup\n- enjoyed flexibility\n\nJavascript glue language\n- not a real language when it started\n- Javascript would be used for e.g. portlets, etc.\n\n\"Always bet on javascript\" - branden eich\n- Language of the web \n\nWeb assembly\n- not replacing javascript\n\nJs project characteristics\n- larger\n- more people\n\nrisk mitigation\n- frameworks fill in the gaps\n- jquery: manipulation of dom\n- angular: module loading\n\nTypescript\n- layer to add give us statically type advantages\n- strict superset of the language\n- extending it with types on top of it: e.g. coffeescript\n\nbest part of typescript\n- don't need to switch to typescript\n- can use //@ts-check to check typescript\n- add a jsconfig.json file to project\n- can annotate types in parameters\n- otherwise, infer the default type\n- increment slowly and allow ts and js to coexist\n  - reduces barrier to conversion\n\ninterfaces\n- can enforce types passed in\n- normally they are in documentation but can be enforced\n  \nSubvert type system\n- can create aliases; can use any type\n- can slowly replace that interface\n\n# Track B: I like my tests, i like i like my friends, flake-free and reliable with Amir Rustamzadeh\n\n\nend to end testing\ncamping trips - friends tend to be unreliable\nend to end testing can be reliable if done properly\n\nrenaissance of the web\n- complexity has moved to front end now\n- sending large javascript applicatiosn down the wire\n- testing them end to end has not changed since\n- 2006 (selenium) \n\njsdom or dom emulation\n- jsdom not a real browser\n- primary way to use e2e testing\n\ndon't let users be first e2e test\n- cost time and money\n- otherwise, use a crash reporter\n- should test exact experience of user\n\nCypress.io\n- easy way to test to test cypress\n- electron application\n- can be launched with npx (it is a binary)\n- can have access to devtools after launch\n- can inspect requests\n- easy to debug\n\ncypress commands\n- headless `cypress run --record` video recording with test run\n- cypress open \n\n# Track A: npm and the future of JavaScript with Laurie Voss\n\nnpm audit\n- tool to fix issues\n\nneed to switch from yarn\n- security\n- npm just as fast as yarn now\n\nnpm.community - where can track fixes\ndon't use github - moved to discorse\n\nnpm users aren't always writing javascript\n- some use php, java, c++, c#\n\ndevs pick javascript\n- pick because of npm\n- more tools to get\n\nsecurity is a concern\n- switch with TLA\n- enterprise can controll what makes it into your domain\n\ngrowth in context\n- registry grown 1400% since 2014\n- registry growing so fast new users showing up\n- 51% users using less than 2 years\n\nframework never die\n- they only fade away\n- start new frameworks and retire software slowly\n- framework has long slow decay\n\nreact\n- running away with the web (60%)\n- no longer runaway growth\n\nangular\n- 40% users using angular\n- download data says half users \n- angryler - angular seeing fewer downloads\n\nember\n- bounceback\n- not seen at different\n\nvue\n- guess that new users are adopting vue over react\n- new users not using react\n\nreact ecosystem\n- has many parts\n- triump of react is because of the react-router\n- was able to decouple the router from framework\n- react is a trumph of modular design\n- able to adapt to more use cases\n\nRedux\n- flux users abandoned to redux\n- flux was highly unpopular\n\ngraphql\n- red hot\n- apollo is running away right now\n\nbackend frameworks\n- only express\n\nnext.js\n- don't need to make pita to create react app\n- growth is strong\n\ntooling\n- should figure out what part to bake in\n\ntypescript\n- 46% use\n- don't use a seperate package manager\n- microsoft used to npm\n- very new microsoft of them\n\nlinters\n- eslint is more popular\n- security incident by eslint\n- team of volunteer\n- didn't turn on 2FA authentication\n- password was stolen\n- had a eslint credential harvester\n\nnpm security resolved this\n- reset npm security tokens\n- created an advisory\n- 10 million users noticed in 30 minutes\n\nnpm is now enforced\n- use npm fix\n- use 2FA (now required)\n\ntesting developers\n- more experience means take security more seriously\n\nbest practices come with experience\n- more experience with more time doing this\n\n## Future of javascript\n\nlearning from history\n- nothing will last forever\n- frameworks will die off\n- e.g. jquery\n- don't cling too tightly to your tools\n\nit should be unwise to bet against react (next couple years)\n- having more modules \n- there are so many react apps to allow it for react to live forever\n\nwhat to learn\n- learn graphql\n- tooling getting better\n- building serverside apis\n- look into graphql\n\nWASM\n- web assembly\n- allow to write any language and transpile to browser\n- interesting idea allows great performance\n- wasm-pack allows to write in rust and publish into javascript\n\nnpm is for the web\n- npm is here for the web\n- doesn't matter what packages; will be a registry full of other languages\n\nweb will remain under construction\n- always half broken\n\n# Track B: What's in your JS? with Ravi Lachhman\n\ntransaction handling delegated to database\n\njavaland threads\n- threads\n- thread pool\n- incoming requests get pool gets larger\n\nin javascript it's equivalent is promises\n- succeed or fail a single time\n\nCNFCF jaeger \n- uber\n- built in java initially\n- limiting factor unable to get trace information from application\n- can implment into your node client when interacting with traps\n- hope to get user data was tremendous\n\ndependency hell\n- might load differently on different machines\n- transitive dependency hard to debug\n\npractice npm hygiene\n\nprofiling is important now\n- figure out what is being used where\n\nOWASP has dependency checker\nCVE - common vulnerability \n- score and metric how many users impacted for vunerabilities\n- getting github may let you know\n\n\n# Track A: JS, Concurrency in the dom\n\nbrowsers have single thread\n- the main thread\n- javascript runs on main thread by default\n- browser cannot do anything else at the same time\n- must achieve 60FPS\n\n60FPS\n- standard for being performant\n- human can recognize differences in framerate\n- movies run at 20fps\n\nbreak into 8/16 ms\n- what happens in 8ms?\n- click event then need to process this event\nuse process\n- event process\n- determine new state\n- do state change processing\n\nissue DOM updates\n- what happens when we don't push it out and becomes 10ms\n\nwhat does this mean to end user?\n- means past frame budget\n- this is called jank\n\nmobile devices\n- performance isn't equal on every device\n\nbrand new device by price segments\n- 15/75 percentile\n- A series processes perform past moores law\n- creates a different problem\n- devices are not close to reality\n\nthis performance gap hurts userrs\n\nmulticore performances over time\n- nokia 2 is a popular phone for 80 bucks and selling well\n\nimpact?\nAres6 test \n- does babel transpilation\n- bad test\n- but should introduce runtime capabilities\n- entirely single-core focused\n\nAres6 Test output\n- iphonex 23.35 seconds\n- nokia 2 438.67ms\n\nnew api web workers\n- 2009\n- in every browser you care about\n- a way to write multi-threaded javascript\n- share no state\n- no access to the dom\n\nmyths\n- dangerous\n\nCloony\n- await response and spawns new webwork\n\nnew ES \n- jsblucks umlot over o\n- block defining here can run in any thread\n- up to browser runtime to allow to run\n- introduces new problem\n  - issue with lexical scope\n  - proposal introduces \n  \nstockroom\n- use redux in seperate thread\n\nWorkerDOM\n- expose dom api to webworker\n\noriginal requirements\n- can make react work with webworker\n- support whole variety of programming\n- works with some issues\n\nuse cases\n- framework authors improve existing app\n- run with webworker to improve performance\n\nworker dom changes\n- changes 18ms but things on main thread is reduced and improve performance\n- now can break barrier of 60 ms\n\nhow does this work?\n\nmain thread / worker thread\n- first thing happens runtime will create worker and load javascript worker\n- worker dom works in main thread\n\nneed way to transmit between threads so minimize class types\n- div can be represented as NodeType.ELEMENT_NODE\n- once it's been transferred small info needed after the second time\n- create hydratedNode type to transfer between nodes\n\nwhat we learned \n- given same complexity of webworkers\n\nProcess to move between threads\n- use sub cypher to node name\n- use static keys to convert object structure to keys and index of strings\n- create string pool for all parts that hasn't been recieved on both sides of threads\n- represent it in succint way\n- able to use integer representation of dom\n- for now is very efficient\n\nmutation\n- must be able to respond to input events\n\nmutationObserver\n- can create own mutationObserver\n- we can observe things like value changes\n\nmotivation\n- allow amp documents to run in their own js\n\n# Track B: A new way to align programming paradigms across client \u0026 serverless by Jeff Hoffer\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchrisl8888%2Fjsconf-18-notes","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchrisl8888%2Fjsconf-18-notes","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchrisl8888%2Fjsconf-18-notes/lists"}